How to Reorder Categories Shop Page WooCommerce Storefront Theme

WooCommerce Storefront Reorder Categories Shop PageProduct categories are used to provide an extra layer of information about your products. Moreover, they help to organize your store. Additionally, it allows customers to easily navigate through products in your store to find the products they want.

However, product categories are considered less specific than product tags when it comes to the product hierarchy. They are displayed on the Shop page or the Frontpage of the Storefront theme if you choose to display them there.

WooCommerce Storefront Reorder Categories Shop Page

Product categories follow a default ascending order and are ordered by their names. However, how do you change this default arrangement? You will be surprised to know how easily you can change category order using the steps I am about to share.

It is worth mentioning that the category order has a significant effect on how readers approach your content. The default arrangement makes the category list look inflexible and meaningless sometimes.

This means that you need to reorder the category differently and more interestingly in WordPress. You might want to order product categories in descending order of their IDs to help customers see the latest categories of products added by you whenever they visit your store. In this brief tutorial, I will show you to do just that.

Reordering WooCommerce Product Categories Using a Shortcode in the Storefront Theme

WooCommerce provides a lot of shortcodes that you can use to display products and product categories. In this post, I will use the [product_categories] shortcode to show categories on any page. Moreover, it has a list of parameters, one of which we will use today to sort categories.

In this example, the order_by parameter can be assigned different values depending on what we wish to order the categories. Since their names by default already order them, let’s try assigning the “ID” value to this parameter.add shortcode to the page

Additionally, the order parameter has the value “ASC” by default. This means that the categories are displayed in ascending order. You can see that the categories are displayed in their IDs’ ascending order in the image below. This is because we have assigned the value of “ID” to the orderby parameter.Category order by ID

Reordering WooCommerce Product Categories Using a PHP Code in the Storefront Theme

Here are the steps that you need to follow:

  1. Log into your WordPress site and access the Dashboard as the admin user.
  2. From the Dashboard menu, click on Appearance Menu > Theme Editor Menu. When the Theme Editor page is opened, look for the theme functions file to add the function to reorder WooCommerce product categories.
  3. Add the following code to the php file:
add_filter( 'woocommerce_product_subcategories_args', 'ts_woocommerce_get_subcategories_ordering_args' );




function ts_woocommerce_get_subcategories_ordering_args( $args ) {

$args['order'] = 'desc';

$args['orderby'] = 'title';

return $args;

}
  1. This code will display the categories in the descending order of their titles (names) on the Shop page. This is the outcome:reordering using Name
  2. However, if you wish to sort these categories in the descending order of their IDs (to show the latest categories first), use this snippet:
add_filter( 'woocommerce_product_subcategories_args', 'ts_woocommerce_get_subcategories_ordering_args' );

function ts_woocommerce_get_subcategories_ordering_args( $args ) {

$args['order'] = 'desc';

$args['orderby'] = 'ID';

return $args;

}
  1. This will be the outcome:Category order by ID

Conclusion

I have shared that WooCommerce product categories follow a default ascending order and are ordered by their names in this guide. At times, you may want to change this order. That is why I have shared how you can reorder the default product categories.

In the first section, I reordered the categories using the [product_categories] shortcode. I assigned it the order_by parameter and the “ID” as the value.

In the second section, I have shared two code snippets. The first one displays the categories in the descending order of their titles (names) on the Shop page. The second code displays these categories in their IDs’ descending order (to show the latest categories first.

However, I highly recommend hiring a developer if you are not familiar with using shortcodes or manipulating code. This will ensure that you will not mess up your site.

Similar Articles