WooCommerce allows you to customize the sorting order of your attributes and variations displayed on the product page.
For instance, if you prefer the item size options to display in a specific sequence like small, medium, large, etc., when customers are selecting the size variation, you can easily adjust the sort order by simply dragging and dropping the attribute into the desired position.
A. Sort global attribute terms
WooCommerce offers you 2 methods to sort global attribute terms. Here’s a step-by-step guide to swiftly changing the sort order of global attributes for your WooCommerce products:
Method 1: Default sort order
Step 1: In the Dashboard > Click Products > Attributes in the left menu.
In this section, we’ll change the variations and attributes sort order for Color.
Step 2: Click on “Edit” under the Color attribute.
Step 3: Then, on the “Edit Attribute” page, navigate to the “Default sort order” dropdown.
This section assists the administrators in managing the sort order of terms on the shop product pages, offering 3 options:
- Name
- Name (numeric), and
- Term ID.
Choose the desired order and then click on the “Update” button to apply the changes.
It is noted that the custom ordering will be the 2nd method below.
Now that the default sort order is configured, it’s important to verify if the changes in order are reflected in the template.
Method 2: Custom sort order
Custom ordering enables you to easily rearrange attribute terms by dragging and dropping them within the attribute section. Let’s walk through how it functions.
Step 1: In the Dashboard > Click Products > Attributes in the left menu.
In this section, we’ll also change the variations and attributes sort order for Color.
Step 2: Click on “Configure terms” below the color attribute.
Clicking on “Configure terms” will redirect you to the “Product Color” page.
To adjust the order of colors, hover over the three lines next to each attribute. You can then drag the attributes up or down to rearrange them according to your preference. When hovering over, the cursor will be displayed as a hand icon.
Now, visit the Product page to verify the new custom order.
B. Sort custom attribute terms
If you are new to the term Custom attributes, please refer to look through this part of our documentation.
There is no way to sort custom attributes, you must remove them and add them in the desired order.
* Important note: It is cautioned and not recommended to rename the custom attribute terms in order to sort the existing custom attribute as the assigned values might be conveyed to each term, they can not be changed respectively after renaming the terms. Moreover, you can not drag and drop custom attribute terms to sort custom attributes.