How to Remove, Rename, Reorder or Add Custom Sorting Options

5
(1)

How to Remove, Rename, Reorder or Add Custom Sorting Options

You can also check my another tutorial if you want to remove the sorting dropdown completely.

Here we are going to use just one filter hook woocommerce_catalog_orderby, it is very similar to how we add or remove items from the my account menu, admin columns etc.

Ok, so the default sorting options are on the screenshot:

Default product sorting options in WooCommerce

And this is the code which allows to remove them:

add_filter( 'woocommerce_catalog_orderby', 'misha_remove_default_sorting_options' );
 
function misha_remove_default_sorting_options( $options ){
 
	unset( $options[ 'popularity' ] );
	//unset( $options[ 'menu_order' ] );
	//unset( $options[ 'rating' ] );
	//unset( $options[ 'date' ] );
	//unset( $options[ 'price' ] );
	//unset( $options[ 'price-desc' ] );
 
	return $options;
 
}

You can insert all the code from this article to your theme functions.php file.

I think everything should be clear in the above code, but just in a case:

  • menu_order – Default sorting, so by default products are displayed by a custom order and if the custom order is not set – alphabetically. Here is a tutorial on how to change it.
  • popularity – Sort by popularity,
  • rating – Sort by average rating,
  • date – Sort by latest,
  • price – Sort by price: low to high,
  • price-desc – Sort by price: high to low;

The product search page also has a “Relevance” relevance option but it is hardcoded and we can not remove it.

Rename the Default Sorting Options

Nothing special here, we are using just the same filter hook – woocommerce_catalog_orderby.

A simple example for you – let’s assume that customers rarely use sorting by “Price: high to low”, so we do not need it? In this case we have to do two things: remove it and rename “Sort by price: low to high” to just “Sort by price”, correct?

add_filter( 'woocommerce_catalog_orderby', 'misha_rename_default_sorting_options' );
 
function misha_rename_default_sorting_options( $options ){
 
	unset( $options[ 'price-desc' ] ); // remove
	$options[ 'price' ] = 'Sort by price'; // rename
 
	return $options;
 
}

Did it work out great? Check this screenshot:

How to rename any of the default sorting options on the WooCommerce shop page

Change the Order of Sorting Options

I didn’t want to write about it the whole chapter, but changed my mind  I know for somebody it could be obvious, but there is still a chance that it will help someone.

The most simple and clean way to change the order of sorting options is to redefine the whole array, like this:

add_filter( 'woocommerce_catalog_orderby', 'misha_change_sorting_options_order', 5 );
 
function misha_change_sorting_options_order( $options ){
 
	$options = array(
 
		'menu_order' => __( 'Default sorting', 'woocommerce' ), // you can change the order of this element too
		'price'      => __( 'Sort by price: low to high', 'woocommerce' ), // I need sorting by price to be the first
		'date'       => __( 'Sort by latest', 'woocommerce' ), // Let's make "Sort by latest" the second one
 
		// and leave everything else without changes
		'popularity' => __( 'Sort by popularity', 'woocommerce' ),
		'rating'     => 'Sort by average rating', // __() is not necessary
		'price-desc' => __( 'Sort by price: high to low', 'woocommerce' ),
 
	);
 
	return $options;
 
}

My result:

How to easily reorder sorting options in WooCommerce

Some comments:

  • I set the filter hook priority to 5 just in case there would be plugins which can add their own sorting options as well. If you set the hook priority to 99999, you will definitely take off this ability from them.
  • You can set option names directly in your language if you want, without __() function.
  • You can add, remove or rename the options directly in this code as well.

Add a Custom Sorting Option

I have a bonus for you – we are going to create two of them!

First of all let’s decide what are our custom options going to be. Do you remember how we can usually sort posts in WordPress using WP_Query?

  • By all the post data stored in wp_posts MySQL table, like title, modified etc.
  • By post meta values

Based on this I am going to create the following options:

Create custom product sorting options in WooCommerce

The only thing you need to do in order this options to appear in the dropdown is to use the below code:

add_filter( 'woocommerce_catalog_orderby', 'misha_add_custom_sorting_options' );
 
function misha_add_custom_sorting_options( $options ){
 
	$options['title'] = 'Sort alphabetically';
	$options['in-stock'] = 'Show products in stock first';
 
	return $options;
 
}

You may think – but what is the default product sorting, it looks like they are already displayed by title, isn’t it? Nope – the default sorting is by menu order and then by title.

But obviously it is not enough. When you select any of the added options, nothing will happen. Because you have to do one more step.

add_filter( 'woocommerce_get_catalog_ordering_args', 'misha_custom_product_sorting' );
 
function misha_custom_product_sorting( $args ) {
 
	// Sort alphabetically
	if ( isset( $_GET['orderby'] ) && 'title' === $_GET['orderby'] ) {
		$args['orderby'] = 'title';
		$args['order'] = 'asc';
	}
 
	// Show products in stock first
	if( isset( $_GET['orderby'] ) && 'in-stock' === $_GET['orderby'] ) {
		$args['meta_key'] = '_stock_status';
		$args['orderby'] = array( 'meta_value' => 'ASC' );
	}
 
	return $args;
 
}

Post meta _stock_status can have only one of the following values: instock, outofstock, onbackorder.

Now it should work!

Sort WooCommerce products alphabetically or display in stock products first

Of course the second filter is not necessary if out of stock products are hidden anyway. Check out that article, maybe hiding out of stock products completely is the more preferrable option for you.

Bài viết này hữu ích như thế nào?

Hãy bấm vào ngôi sao để đánh giá!

Đánh giá trung bình 5 / 5. Số phiếu bầu : 1

No votes so far! Be the first to rate this post.

0 0 votes
Article Rating
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x