Magento2 - Reorder options inside layered filter

Question

I'm quite new to Magento so maybe this is a stupid question.

I have some filters set up in the layer navigation, one of them is the size of the products we're selling.

I'd like to know if it's possible to reorder the options inside that size filter because now they are appearing in alphabetic order but I'd like to display them something like: XS-S-M-L-XL. Below image is a screenshot of how they are displaing right now.

I've read a lot of questions and posts but they are only to rearrange the entire filters on the layered navigation, not the options inside them.

Hope I've been clear enough for you to understand. If any further details are needed just let me know!

Thanks in advance.

Answer 1

To rearrange Size attribute options

In the admin, edit the attribute and in the options section of attribute. try to drag and drop the option to required place and save the attribute.

Clear cache and it will work on the frontend.

Answer 2

To rearrange Size Attribute value in layered navigation you have to override below core file.

vendor/magento/module-swatches/view/frontend/templates/product/layered/renderer.phtml

The renderer.phtml file is responsible for display HTML for attribute in layerd navigation.

In renderer.phtml the file you can see they apply switch case (switch ($swatchData['swatches'][$option]['type']) method to display attribute like size, color etc..

In the switch case function you need to look in to case '0': because Size attribute type is executed in case '0':

So you have to sort this code ($swatchData['swatches'][$option]['value']) using php function or any other method to display size attrinute value in XS-S-M-L-XL

To override template file see How to override phtml file in magento2

I hope it helps!