Adding ‘sort by’ drop down on custom page using woocommerce short code

I have created a custom page using woocommerce short code for product categories. At the moment, it’s pretty sparse as I’ve only just started on the new site.

I just need the default ‘sort by’ drop down element adding but have no idea how to do it.

I found some code here >>Woocommerce, sort dropdown on shortcode based product lists

and it certainly placed the drop down I need on the site (although I’d like it aligned left).

The only problem now, is that it’s displaying the products with enormous images and all in a single vertical column.

I’m not a PHP programmer and am wondering if I’ve deleted some important code in the php file I modified. (thank god I took a copy of the original!).

Can anyone help? Is there a better way to add the sort by drop down onto my custom pages?

This is one of the pages I’ve created >> http://www.sdmtest1.co.uk/notebooks-journals/

Here is the code I added.

/**
 * List products in a category shortcode
 *
 * @param array $atts
 * @return string
 */
public static function product_category( $atts ) {
    $atts = shortcode_atts( array(
        'per_page' => '12',
        'columns'  => '4',
        'orderby'  => 'title',
        'order'    => 'desc',
        'category' => '',  // Slugs
        'operator' => 'IN' // Possible values are 'IN', 'NOT IN', 'AND'.
    ), $atts );

    if ( ! $atts['category'] ) {
        return '';
    }

    // Default ordering args
    $ordering_args = WC()->query->get_catalog_ordering_args( $atts['orderby'],    
$atts['order'] );
$orderby = 'title';
$order = 'asc';
if ( isset( $_GET['orderby'] ) ) {
    $getorderby = $_GET['orderby'];
}
if ($getorderby == 'popularity') {
    $orderby = 'meta_value_num';
    $order = 'desc';
    $meta_key = 'total_sales';
} elseif ($getorderby == 'rating') {

    $fields .= ", AVG( $wpdb->commentmeta.meta_value ) as average_rating ";

    $where .= " AND ( $wpdb->commentmeta.meta_key = 'rating' OR $wpdb->commentmeta.meta_key IS null ) ";

    $join .= "
        LEFT OUTER JOIN $wpdb->comments ON($wpdb->posts.ID = $wpdb->comments.comment_post_ID)
        LEFT JOIN $wpdb->commentmeta ON($wpdb->comments.comment_ID = $wpdb->commentmeta.comment_id)
    ";

    $orderby = "average_rating DESC, $wpdb->posts.post_date DESC";

    $groupby = "$wpdb->posts.ID";   

} elseif ($getorderby == 'date') {
    $orderby = 'date';
    $order = 'desc';
} elseif ($getorderby == 'price') {
    $orderby = 'meta_value_num';
    $order = 'asc';
    $meta_key = '_price';
} elseif ($getorderby == 'price-desc') {
    $orderby = 'meta_value_num';
    $order = 'desc';
    $meta_key = '_price';
}
$args = array(
    'post_type'             => 'product',
    'post_status'           => 'publish',
    'ignore_sticky_posts'   => 1,
    'orderby'               => $orderby, // $ordering_args['orderby'],
    'order'                 => $order, // $ordering_args['order'],
    'meta_key'              => $meta_key,
    'fields'                => $fields,
    'where'                 => $where,
    'join'                  => $join,
    'groupby'               => $groupby,
    'posts_per_page'        => $per_page,
    'meta_query'            => array(
        array(
            'key'           => '_visibility',
            'value'         => array('catalog', 'visible'),
            'compare'       => 'IN'
        )
    ),
    'tax_query'             => array(
        array(
            'taxonomy'      => 'product_cat',
            'terms'         => array( esc_attr( $category ) ),
            'field'         => 'slug',
            'operator'      => $operator
        )
    )
);

if ( isset( $ordering_args['meta_key'] ) ) {
    $args['meta_key'] = $ordering_args['meta_key'];
}

ob_start();

$products = new WP_Query( apply_filters( 'woocommerce_shortcode_products_query', $args, $atts ) );

$woocommerce_loop['columns'] = $columns;

if ( $products->have_posts() ) : ?>

<div style="width:100%;">
    <div style="float:right">
        <form class="woocommerce-ordering" method="get">
            <select name="orderby" class="orderby">
                <?php
                    $catalog_orderby = apply_filters( 'woocommerce_catalog_orderby', array(
                        'menu_order' => __( 'Default sorting', 'woocommerce' ),
                        'popularity' => __( 'Sort by popularity', 'woocommerce' ),
                        'rating'     => __( 'Sort by average rating', 'woocommerce' ),
                        'date'       => __( 'Sort by newness', 'woocommerce' ),
                        'price'      => __( 'Sort by price: low to high', 'woocommerce' ),
                        'price-desc' => __( 'Sort by price: high to low', 'woocommerce' )
                    ) );

                    if ( get_option( 'woocommerce_enable_review_rating' ) === 'no' )
                        unset( $catalog_orderby['rating'] );

                    foreach ( $catalog_orderby as $id => $name )
                        echo '<option value="' . esc_attr( $id ) . '" ' . selected( $getorderby, $id, false ) . '>' . esc_attr( $name ) . '</option>';
                ?>
            </select>
            <?php
                // Keep query string vars intact
                foreach ( $_GET as $key => $val ) {
                    if ( 'orderby' === $key || 'submit' === $key )
                        continue;

                    if ( is_array( $val ) ) {
                        foreach( $val as $innerVal ) {
                            echo '<input type="hidden" name="' . esc_attr( $key ) . '[]" value="' . esc_attr( $innerVal ) . '" />';
                        }

                    } else {
                        echo '<input type="hidden" name="' . esc_attr( $key ) . '" value="' . esc_attr( $val ) . '" />';
                    }
                }
            ?>
        </form>
    </div>
</div>
<div style="clear:both;"></div>

    <?php woocommerce_product_loop_start(); ?>

        <?php while ( $products->have_posts() ) : $products->the_post(); ?>

            <?php wc_get_template_part( 'content', 'product' ); ?>

        <?php endwhile; // end of the loop. ?>

    <?php woocommerce_product_loop_end(); ?>

<?php endif;

woocommerce_reset_loop();
wp_reset_postdata();

return '<div class="woocommerce columns-' . $columns . '">' . ob_get_clean() . '</div>';

}

I edited in dreamweaver and it flagged a syntax error. I wasn’t sure where the code I pasted was to begin and end and I kinda lost this bit in the process.

        // Remove ordering query arguments
    WC()->query->remove_ordering_args();

    return $return;
}

Thanks,
Loren