How to customize WooCommerce product sorting and ordering

WooCommerce sort products

As a business-savvy online store owner, you probably already know that the order in which WooCommerce products are sorted and displayed on the front-end is essential to the success of your e-commerce store. It directly influences which items capture the customer’s attention first.

Allowing customers to sort your product list in different ways is also important. It enables you to help prospective customers find the products they want to purchase quickly and easily.

Essentially, WooCommerce product sorting forms a central part of your store’s navigation structure alongside other on-page elements such as the menu, keyword search, and product filters.

In this article, you will learn how to customize WooCommerce sorting on your online store using built-in options. You’ll also learn how to add more advanced product sorting to your e-commerce store using the WooCommerce Product Table plugin. You can change the WooCommerce product order based on a wide range of sort criteria including product name, description, order by SKU, price, attribute, categories, tags, and more.

What product sort options are built into WooCommerce?

Out of the box, WooCommerce gives store owners some basic product sort options.

The Customizer

WordPress Customizer

You can go to the CustomizerWooCommerceProduct Catalog to set the initial sort order of products in your online store using the WordPress Customizer. You can choose default sorting (custom ordering + name), popularity, average rating, most recent, and price.

WooCommerce shop page

Most WooCommerce-optimized themes display a basic sort dropdown at the top of the shop and category pages. Customers can use this to change the default sorting order by popularity, average rating, latest, price: low to high, and price: high to low.

The only problem is that the default product sorting options in WooCommerce are pretty limited. More specifically:

  • You can only sort WooCommerce products by a very restrictive list of values. The default options let you sort by popularity, average rating, latest, price: low to high, and price: high to low.
  • While you can choose how products are sorted, there’s no option to select the sort order.
  • The default options don't improve the layout of your products or present them in a way that allows easy sorting or comparisons.

Gutenberg block editor

When you use any of the Products blocks in the Gutenberg block editor which comes with WordPress, you can choose the sort order. This controls the order of products when the page first loads.

Products block order sort options

Lots of store owners build their store pages using other page builders such as Elementor or Divi. That's fine - just check which modules they provide for displaying products, and look for sort options.

Shortcodes

Similarly, you can list WooCommerce products using shortcodes. Each shortcode includes options for controlling the initial sort order and direction of the products. You can learn all about these in our Complete guide to WooCommerce shortcodes.

Custom snippets

Developers can also use custom code to sort products programmatically. WooCommerce have provided a useful article to get you started with this.

But what about letting customers sort products?

On the front end, WooCommerce itself displays a 'Sort Products' dropdown at the top of your main shop pages. For example, you'll see this on the Shop page, product category pages, etc. Customers can use this to sort by various data such as product name and price, in ascending or descending order.

WooCommerce Storefront products sort dropdown

As you can see, all of these product sort options are pretty limited. Most of them focus on letting store managers control the sort order, not on allowing customers to re-order products.

Thankfully, there’s a better way to let customers sort products on the front-end.

Product Table - the perfect WooCommerce product sorting plugin

The WooCommerce Product Table plugin provides a more flexible and effective way to sort products.

You can enable product tables globally on your shop and category pages. Alternatively, you can insert custom product tables using a shortcode to any page you’d like. This provides a better, more intuitive way to sort products throughout your store in just a few minutes.

Whether you're looking for a WooCommerce sort products by attribute plugin or a way to sort in a particular order, WooCommerce Product Table makes it easy.

Why use WooCommerce Product Table for product sorting?

  • Better layout. Instead of the basic grid layout that comes out of the box with WooCommerce, the WooCommerce Product Table plugin lets you list products in an intuitive, user-friendly table layout with multiple columns of information. This naturally lends itself to sorting WooCommerce products in a variety of different ways.
  • Tons of sorting options. WooCommerce Product Table lets you sort by many, many different types of product data. You can sort by product name, attribute, menu order, product ID, SKU, custom fields, price, popularity, reviews, date, and last modified date. In addition, you can also choose to sort products by any column in the table, or even randomly.
  • Set the sort order. For each sorting option, the WooCommerce Product Table plugin lets you choose the sort order using the orderby option. You can choose to sort the products either in ascending order or descending order. For example, you can sort products by product name in ascending order i.e. alphabetical sorting. This way, customers can quickly find products alphabetically.
  • Date sorting. As well as alphabetical sorting, you can set any column as a date column so that it is sorted correctly by date.
  • Customers can sort products. You can set the initial sort order for your products i.e. the default sort order when the page first loads. In addition, this WooCommerce sort products plugin also lets customers sort the products in ascending order or descending (or date) order simply by clicking on any of the table column headers.
  • Bonus options. The column sorting in WooCommerce Product Table works perfectly alongside the plugin’s other features which help prospective customers find products quickly and easily. These include the instant AJAX search box, the ability to choose the number of products per page, and WooCommerce product filters.

With the best WooCommerce product table plugin, column sorting happens automatically as soon as you activate the plugin on your WordPress website. You can use the plugin options to change this as required.

How to set up product sorting

Once you have the WooCommerce Product Table plugin installed and activated on your WordPress website, you can set up WooCommerce product sorting. There are two ways to do this:

Method #1: Configure WooCommerce product sorting for all products

If you want to set the WooCommerce product sorting options for all products then you can simply configure the plugin’s settings. This way, the products on your main shop page and product category pages will follow the sort options and sort order you set in the WooCommerce Product Table settings page.

To do this, head over to WooCommerce → SettingsProductsProduct tables from the WordPress admin menu.

Scroll down till you reach the Sorting section. From here, you can set the sorting options. The Sort by option lets you set the initial sort order (i.e. orderby) that’s applied to the product table layout.

WooCommerce Product Table sort options

You can choose from the following options using the dropdown:

  • As listed in the Products screen (menu order)
  • SKU
  • Name
  • ID
  • Price
  • Number of sales
  • Average reviews
  • Date added
  • Date last modified
  • Other

Custom product sort options

If you select Other, you can specify which product table column you’d like to sort by. In other words, you can create a custom sorting order for your WooCommerce products:

WooCommerce sort products

The 'Other' option lets you sort products by any column in the table. Keep in mind that this only works if lazy load is disabled. The available columns are:

  • SKU - Order products by their unique SKU code.
  • ID - Sort products by database ID.
  • Name - Order products by name or title.
  • Description - Order products by the first word of the main description.
  • Short-description - Sort products by the first word of the short description.
  • Date - Order products by published date.
  • Categories - Sort by WooCommerce product category.
  • Tags - Order products by tag.
  • Reviews - Order products by average rating.
  • Stock - Sort products by stock status or number of products in stock. (This depends on the inventory settings in your wide WooCommerce store.)
  • Weight - Order products by weight, e.g. lightest or heaviest first.
  • Dimensions - Order products by their dimensions, e.g. size starting with the smallest first.
  • Price - Order products by price.
  • Product attribute - Sort WooCommerce products by attribute, e.g. size. To do this, add att: in the 'Sort column' field followed by the attribute slug, e.g. att:size.
  • Custom field - Sort WooCommerce products by custom field values, e.g. a 'Reference' custom field column. To do this, add cf: in the 'Sort column' field followed by the custom field name, e.g. cf:reference.
  • Custom taxonomy term - Sort WooCommerce products by custom taxonomy terms, e.g. a taxonomy called 'Brand'. To do this, add tax: in the 'Sort column' field followed by the custom field name, e.g. tax:brand.

Change the WooCommerce sort direction

Once that’s done, use the Sort direction option to set the sort order. You can choose:

  • Automatic
  • Ascending (A to Z, 1 to 99)
  • Descending (Z to A, 99 to 1)

Click the Save changes button to continue. It might look something like this on the front-end:

WooCommerce sort products preview

Method #2: Configure WooCommerce product sorting for selected items

If you sell lots of products (or lots of different types of products) then you might want to sort some products in one way and others in another way. For example, you might want to order clothes by Menu order and shoes by Price.

This is possible with the WooCommerce Product Table plugin. All you have to do is set the product order directly in the shortcode. Following our example, the shortcode might look something like this for products in the Clothes product category:

[product_table columns="image,name,summary,price,buy" category="clothing" sort_by="menu_order" sort_order="asc"]

It would look like this on the front-end:

Sorted by menu order

And this for ordering products in the Shoes product category:

[product_table columns="image,name,summary,price,buy" category="shoes" sort_by="price" sort_order="asc"]

The sorted products would look something like this on the front-end:

Sorted by price

Simply add the shortcode to the page or post where you’d like to display the sorted product table and click the Publish button.

Bonus: Re-order products using the menu order

The WooCommerce Product Table plugin lets you sort products by menu order. This gives you granular control over the order of products on your main shop page. You can set the menu order for your WooCommerce products directly from the WordPress back-end.

WooCommerce menu order

Go to WooCommerce → Products from the WordPress admin panel. Click on the Sorting tab. From here, you can simply drag and drop the products into place. The products that appear first in the list will appear at the top of the product table on the front end.

Bonus: Enhance your customer's shopping experience with the WooCommerce Products Filter plugin

If you're reading this article on how to customize WooCommerce product sorting and ordering, chances are you're interested in making it easier for your customers to find and purchase the products they want. But did you know that you can also enhance your customers' shopping experience by using a WooCommerce Products Filter plugin?

The WooCommerce Products Filter plugin offers a wide range of filters to help customers narrow down their search for the perfect product. Customers can filter products by categories, attributes, color, tags, custom taxonomy, price, ratings, in-stock, and on-sale. What's more, the plugin allows you to display the filters in a variety of formats, including dropdown lists, checkboxes, radio buttons, labels/tag clouds, images, or color swatches.

But that's not all. The WooCommerce Products Filter plugin also allows customers to choose how they want the list of results sorted. This means that they can filter and sort products based on their preferences, making it easier for them to find what they're looking for. By providing a more personalized and streamlined shopping experience, you can increase customer satisfaction and loyalty. So if you're looking to take your WooCommerce store to the next level, consider using a products filter plugin in addition to customizing your product sorting and ordering.

Where to get the product sorting plugin

The product sort options you get out of the box with the WooCommerce plugin are pretty basic.

Using the WooCommerce Product Table plugin, you can set the initial sort order and let customers sort products themselves in a variety of different ways. Plus, you’ll have the option to configure the sorting settings globally or on a per-category basis.

Ready to sort products on your WooCommerce store, increase product visibility, and boost sales? Get the WooCommerce Product Table plugin today.

8 Comments

    • Hi, Vijay.

      Thanks for asking about an option to sort products by "last purchased" (recently purchased on top). While we don't have any immediate plans to implement this, a few other people have previously requested this feature and we’re tracking the amount of demand to help us decide whether to prioritize it in future.

      I have added your ‘vote’ to our feature request list, and we will let you know if we add this to a future version of the plugin. In the meantime, I'm sorry that this isn't possible.

      Please let me know if you have any more questions. Cheers.

    • Hi, Nikolai. Thanks for asking. By default, WooCommerce only allows you to set a regular price and a sale price - and these are displayed in the price data field. Price and percentage discounts can be set by using a pricing plugin, and the price data field value displayed is usually the discounted price with the regular price crossed out.

      What you would like to achieve is two-fold: First the discounted amount (e.g. $10 less) or percentage (e.g. 10%) needs to be displayed/included in the price field data value, and only then can a sorting function by this value be possible. I have added this to our feature request list so that we can track the amount of demand. We will let you know if we add this to a future version of the plugin.

      In the meantime, I'm sorry that this isn't possible.

      As an alternative or workaround, you could add/create the discount volume value as either a custom field or custom taxonomy and display it as a column in the product table, which you can then set the sorting by.

      Please let me know if you have any more questions. Cheers!

  1. Hi, Just wanted to ask, Can I still use the grid view but with the sorting functionalities of the plugin?

    • Hi Jo,

      Thanks for your comment.

      The sort option/feature of our plugin only appears within the product table, and cannot be used outside the table. WooCommerce itself comes with a sorting option on its own.

      If it interests you, you can provide an option to your customers to switch between the default grid layout and the product table view (so they can use the functionality that comes with our plugin). To do this, please see Code Snippets - Switch Between Grid and Table View in Shop/Category Archive Pages.

      I hope this helps! Let us know if you have any more questions/concerns. You may also reach us via our dedicated Support Center. Cheers!

  2. Does your table do tables for shoes?
    So each model shoe would be the row and the size attributes in each column
    We need this for wholesale where customers are buying several sizes of each shoe.
    YOur demos shoe shoes but no size attributes, which no one buys a shoe without the size.

    • Hi, Tim. You can achieve this by adding the size as a global product attribute and the different size as its terms in WooCommerce on your site, then use this for the product variations also in WooCommerce. Once this is set up, you can then use the available Product variations options to display the product and its variations in the product table on your site. You can see examples of this in our Product Table with Variations front-end demos (albeit we use hoodies and shirts in our demo, which you can do the same for shoes).

      I hope this makes sense and helps. Should you have any more questions, you can also get in touch with us by enquiring via our dedicated Support Center. Thanks!

Please share your thoughts...

Your email address will not be published. Required fields are marked *