How to Change the Sort Order of WooCommerce Variations and Attributes

Share on facebook
Share on linkedin
Share on twitter

Looking to rearrange the order of your custom variations and attributes on the product shop page?

WooCommerce lets you change the sort order for your custom attributes and variations that appear in the product template.

For example, if you want the item size to appear in a particular order, say small, medium, large, etc., when customers want to select the size of the variation, you can change the sort order just by dragging and dropping the attribute in the required position.

The other case can be where the attributes might show wrong order in the dropdown menu for the variable products, such as Small, Large, Medium instead of Small, Medium, Large.

To solve this problem, we have developed a tutorial to show you exactly how to change the sort order of attributes of your WooCommerce products quickly.

Let’s get started!

Changing the Sort Order of WooCommerce Variations and Attributes

Method 1: Product Variation or Attribute Sort Order Type

Here in this section, we’ll help you change attribute sort order type by term ID, alphabetical order, or custom sort order.

Let’s get started.

Step 1: Click Products >> Attributes in the left menu.

In this, we’ll be changing the variations and attributes sort order for size.

Step 2: Click on “edit” under the size attribute. Refer to the image as shown below.

Step 3: Now, on the “Edit Attribute” page, scroll to the “Default sort order” dropdown menu.

This section helps the store admins to manage the sort order of the terms on the shop product pages with four options:

  • Custom ordering
  • Name
  • Name (numeric), and
  • Term ID.

Select the required order and click Update. (For this scenario, we are selecting Custom ordering).

Since the default sort, the order is set up, it’s time to check the template to see if the changes in orders are reflected.

Also, for a complete customer order sorting of your variations and attributes, follow the next steps.

Method 2: Custom Variation or Attribute Sort Order

Since we selected “Custom ordering” in the previous method, you can easily customize your variations and attributes.

Custom ordering allows you to drag and drop the attribute terms in the attribute section.

Let’s see how it works.

Step 1: Click Products >> Attributes in the left menu.

In this, we’ll be using the drag and drop method to set up the custom sort order for the “size” attribute.

Step 2: Click on “Configure terms” under the size attribute. Refer to the image as shown below.

Clicking on the “Configure terms” will direct you to the “Product Size” page.

To sort the size order, hover over the three lines to drag the attributes up or down. The cursor over hover will be displayed as.

In this case, we will move XLarge above Large. These changes are saved automatically.

Now you can visit the Product page to check the new custom order.

Tip: For changes to reflect correctly, make sure you clear the page caches if configured.

The correct order on the product page will appear as shown in the image.

This is how we can change the WooCommerce Variations and Attributes sorting order.

Conclusion

Finally, this was the whole tutorial on changing the sorting order for WooCommerce variations or attributes.

We hope you understand all the things correctly and will apply the same to your own WooCommerce store. You can also take help from the attached screenshots to speed up the process. This is all about how to change WooCommerce variations and attributes sort order.

Do let us know if you successfully changed the sort order of your WooCommerce variations and attributes?

Feel free to ping us or write your query in the comment box, and we will help you out in a few hours possibly.

Brian
Brian

Welcome to the Woosuite blog, where we discuss all things WooCommerce. I hope we can help you achieve something today...

Download Variation

Swatches Today

Where should we send your free download?

By downloading you agree to our privacy policy.

Get Access to Demo Now

Enter your  email address below to get access

Get Access to Demo Now

Enter your  email address below to get access

Get Access to Demo Now

Enter your  email address below to get access

Get Access to Demo Now

Enter your  email address below to get access

Get Access to Demo Now

Enter your  email address below to get access

Get Access to Demo Now

Enter your  email address below to get access

Get Access to Demo Now

Enter your  email address below to get access

Get Access to Demo Now

Enter your  email address below to get access