How to Remove Product Sorting Dropdown
In this tutorial I will show you how to completely remove this dropdown from the shop page and product archives:
That’s the result we are going to achieve:
And we are not hiding it with CSS by the way!
If you want to remove a specific sorting options only, then you need this tutorial instead. When removing this dropdown you may also suppose your products to be sorted in a specific way by default, I cover this moment here.
Just for completeness of this tutorial – you should know, that this sorting dropdown HTML code is located in
templates/loop/orderby.php, so if you copy this file from the WooCommerce plugin folder into your theme
woocommerce/loop/orderby.php, you can change anything there or just empty the whole file. But I recommend you to use that method only if you are unable to do the same with hooks.
Our main goal is to disconnect
woocommerce_catalog_ordering() function (it prints the dropdown as you’ve probably guessed) from some hooks. By default it is added to
woocommerce_before_shop_loop action hook with priority 30.
remove_action( 'woocommerce_before_shop_loop', 'woocommerce_catalog_ordering', 30 );
But this way may not work in 100% cases – depends on a theme you’re using.
It even doesn’t work for Storefront, guys!
The code for Storefront theme is similar, we see that the same action hook is used here but with a different priority value. And also here is another hook, that allows the sorting dropdown to be displayed after the products.
remove_action( 'woocommerce_before_shop_loop', 'woocommerce_catalog_ordering', 10 ); remove_action( 'woocommerce_after_shop_loop', 'woocommerce_catalog_ordering', 10 );