<div id="shortcodelic_posts_generator" class="shortcodelic_meta shortcodelicadd_meta shortcodelic_editelement_panel" data-title="<?php _e('Blog posts', 'shortcodelicadd'); ?>">
    <div class="alignleft shortcodelic_options_area">

        <h3><?php _e('Categories', 'shortcodelicadd'); ?>:</h3>
        <select data-name="categories" multiple="multiple">
            <option value=''> <?php _e( 'All', 'shortcodelicadd' ); ?></option>
            <?php 
                shortcodelicAddHierCatSel( 0, '' );
                function shortcodelicAddHierCatSel( $par, $ind ) {
                    $argcats = array(
                        'hide_empty' => 0,
                        'orderby' => 'name',
                        'hierarchical' => 0,
                        'order' => 'ASC',
                        'parent' => $par
                    );
                    $categories = get_categories($argcats);
                    if ( $categories ) {
                        if ( $par == 0 ) {
                            $ind = '';
                        } else {
                            $ind .= '&#8212;';
                        }
                        foreach ($categories as $category) { ?>
                            <option value='<?php echo $category->term_id; ?>'> <?php echo $ind.$category->cat_name; ?></option>
                        <?php shortcodelicAddHierCatSel( $category->term_id, $ind );
                        }
                    }
                }
            ?>
        </select>

        <h3><?php _e('Layout', 'shortcodelicadd'); ?>:</h3>
        <label class="for_select marginhack">
            <span class="for_select">
                <select data-name="layout">
                    <option value=""><?php _e( 'Default', 'shortcodelicadd' ); ?></option>
                    <option value="standard"><?php _e( 'Standard blog', 'shortcodelicadd' ); ?></option>
                    <option value="masonry"><?php _e( 'Masonry grid (original ratio)', 'shortcodelicadd' ); ?></option>
                </select>
            </span>
        </label>

        <h3><?php _e('Grid', 'shortcodelicadd'); ?>:</h3>
        <label class="for_select marginhack">
            <span class="for_select">
                <select data-name="columns">
                    <option value=""><?php _e( 'default', 'shortcodelicadd' ); ?></option>
                    <option value="2"><?php _e( '2 columns', 'shortcodelicadd' ); ?></option>
                    <option value="3"><?php _e( '3 columns', 'shortcodelicadd' ); ?></option>
                    <option value="4"><?php _e( '4 columns', 'shortcodelicadd' ); ?></option>
                    <option value="5"><?php _e( '5 columns', 'shortcodelicadd' ); ?></option>
                    <option value="6"><?php _e( '6 columns', 'shortcodelicadd' ); ?></option>
                </select>
            </span>
        </label>

        <h3><?php _e('Gutter (%)', 'shortcodelicadd'); ?>:</h3>
        <div class="slider_div percent">
            <input data-name="gutter" type="text">
            <div class="slider_cursor"></div>
        </div><!-- .slider_div -->

        <h3><?php _e('Page navigation', 'shortcodelicadd'); ?>:</h3>
        <label class="for_select marginhack">
            <span class="for_select">
                <select data-name="pagination">
                    <option value=""><?php _e( 'Default', 'shortcodelicadd' ); ?></option>
                    <option value="none"><?php _e( 'None', 'shortcodelicadd' ); ?></option>
                    <option value="numbers"><?php _e( 'Numbers', 'shortcodelicadd' ); ?></option>
                    <option value="infinite"><?php _e( 'Infinite button', 'shortcodelicadd' ); ?></option>
                </select>
            </span>
        </label>

        <h3><?php _e('Order', 'shortcodelicadd'); ?>:</h3>
        <label class="for_select marginhack">
            <span class="for_select">
                <select data-name="order">
                    <option value=""><?php _e( 'Default', 'shortcodelicadd' ); ?></option>
                    <option value="DESC"><?php _e( 'DESC', 'shortcodelicadd' ); ?></option>
                    <option value="ASC"><?php _e( 'ASC', 'shortcodelicadd' ); ?></option>
                </select>
            </span>
        </label>

        <h3><?php _e('Order by', 'shortcodelicadd'); ?>:</h3>
        <label class="for_select marginhack">
            <span class="for_select">
                <select data-name="orderby">
                    <option value=""><?php _e( 'None', 'shortcodelicadd' ); ?></option>
                    <option value="ID"><?php _e( 'ID', 'shortcodelicadd' ); ?></option>
                    <option value="title"><?php _e( 'title', 'shortcodelicadd' ); ?></option>
                    <option value="name"><?php _e( 'name', 'shortcodelicadd' ); ?></option>
                    <option value="date"><?php _e( 'date', 'shortcodelicadd' ); ?></option>
                    <option value="rand"><?php _e( 'random', 'shortcodelicadd' ); ?></option>
                    <option value="menu_order"><?php _e( 'menu_order', 'shortcodelicadd' ); ?></option>
                </select>
            </span>
        </label>

        <h3><?php _e('Posts per page', 'shortcodelicadd'); ?>:</h3>
        <div class="slider_div percent">
            <input data-name="ppp" type="text">
            <div class="slider_cursor"></div>
        </div><!-- .slider_div -->
        <small>Leave blank to inherit the global value. If you set a different value the pagination will be removed to avoid issues</small>


        <h3><?php _e('Effect on reveal', 'shortcodelicadd'); ?>:</h3>
        <label class="for_select marginhack">
            <span class="for_select">
                <select data-name="fx">
                    <option value=""><?php _e( 'default', 'shortcodelicadd' ); ?></option>
                    <option value="none"><?php _e( 'none', 'shortcodelicadd' ); ?></option>
                    <option value="pix-fadeIn">pix-fadeIn</option>
                    <option value="pix-fadeDown">pix-fadeDown</option>
                    <option value="pix-fadeUp">pix-fadeUp</option>
                    <option value="pix-fadeLeft">pix-fadeLeft</option>
                    <option value="pix-fadeRight">pix-fadeRight</option>
                    <option value="pix-zoomIn">pix-zoomIn</option>
                    <option value="pix-zoomOut">pix-zoomOut</option>
                    <option value="pix-rotateIn">pix-rotateIn</option>
                    <option value="pix-rotateOut">pix-rotateOut</option>
                    <option value="pix-flipClock">pix-flipClock</option>
                    <option value="pix-swing">pix-swing</option>
                    <option value="pix-turnForward">pix-turnForward</option>
                    <option value="pix-turnBackward">pix-turnBackward</option>
                </select>
            </span>
        </label>

    </div>

    <div class="clear"></div>
    <br>
    <br>

</div><!-- #shortcodelic_posts_generator -->