WooCommerce wrong attribute sort order

How to Change WooCommerce Variations and Attributes Sort Order

Last updated on

I was recently having an issue where the Size attribute was showing in the wrong order in the dropdown box for my variable product (S, L, M instead of S, M, L).  WooCommerce allows you to control the order that your custom attributes and variations appear in the template either alphabetically, by term ID, or by a completely custom sort order.

Product Attribute/Variation Sort Order Type

To change the attribute or variation sort order type alphabetically, by term ID, or a custom sort order:

In the left-hand menu, click Products and then click Attributes.

Change WooCommerce attribute order

On the WooCommerce Attributes page, hover over the attribute you want to change (in this example Size) and click Edit.

WooCommerce custom sort order for variations and attributes

In the Edit Attribute page, open the Default sort order dropdown menu.

There are four different options here. Custom ordering, Name, Name (numeric) and Term ID. Select the order you require and click Update. (In this example we are selecting Custom ordering).

WooCommerce size or color sort order

You can now check you template to see if the ordering is correct. Make sure to clear any page caches if configured.

If you want a completely custom sort order for you attributes/variations, continue to the next step.

Custom Attribute/Variation Sort Order

If you selected Custom ordering in the previous step, you can now set the custom order of your attributes/variations.

In the left-hand menu, click Products and then click Attributes.

In the main Attributes page, hover over your attribute (in this example Size) and click Configure terms.

WooCommerce custom sort order for attributes and variations

In the product attribute page (in this example Product Size), hover over the attribute and use the three lines to drag the attribute up or down. In this example we are moving the size M (medium) above L (large).

WooCommerce variations and attributes sort order

Once you drag and drop the attribute, the setting is saved automatically, you do not need to click save or update anywhere.

Now go to the Product page on the frontend of your website and check that the new custom order is correct. Make sure to clear any page caches if configured.

Let me know in the comments if this helped. Follow me on Twitter, Facebook and YouTube.

p.s. I increased my AdSense revenue by 68% using AI 🤖. Read my Ezoic review to find out how.

1 Star2 Stars3 Stars4 Stars5 Stars 5.00 (1 votes)

Leave a Reply

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

We use Markdown to style comments, like on Github and Reddit.
To do a line break, type two spaces after the sentence.
You can add inline code by wrapping it in backticks: `code here`

    To do an entire block of code  
    type four spaces before the line
    and it will appear in a block like this.
    <-- four empty spaces

2 replies

Hi,

First, Thanks for your guide.
I have small question, what should I do to change the order of variations from a different pages?