Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Sort woocommerce product attribute sizes from small to biggest number WordPress

  • REFUNDED

Hello,

I am having a problem displaying my product attribute size from small to biggest numbers on the front end. I have tried setting attribute to "custom ordering" and dragging and dropping to the correct order but nothing changes on the front end.

I would like a code I may put in functions.php to sort my attributes from smallest to biggest number. You may view screenshot for example.

Answers (6)

2019-08-22

Darlene Grace Arcenal answers:

Have you tried clearing your cache?

2019-08-22

Fahad Murtaza answers:

In the product attribute page (For you it's Size), hover over the attribute and use the three lines to drag the attribute up or down. In this example, the size M is being moved.

2019-08-22

Mohamed Ahmed answers:

Hello George,
Could you send me your site URL?
or if you want to send it privately so send it to [email protected]

2019-08-22

Arnav Joy answers:

Are you using any other plugin which could cause default behaviour to overwrite ?


George Sprouse comments:

Hey Arnav, I don't see any plugin that will affect this. I disabled all woocommerce plugins but still no luck. It is sorting biggest number to small and I am not sure why.

2019-08-22

Reigel Gallarde answers:

Are you somehow using a cache plugin?

2019-08-22

Francisco Javier Carazo Gil answers:

When I need to do it, I use JS because I have not found a better way to do it.

jQuery( document ).ready( function( $ ){
var options = $('#pa_attribute option');
var arr = options.map(function(_, o) { return { t: $(o).text(), v: o.value }; }).get();
arr.sort(function(o1, o2) { return parseFloat( o1.t ) > parseFloat( o2.t ) ? 1 : parseFloat( o1.t ) < parseFloat( o2.t ) ? -1 : 0; });
options.each(function(i, o) {
o.value = arr[i].v;
$(o).text(arr[i].t);
});

options = $('#pa_alto option');
arr = options.map(function(_, o) { return { t: $(o).text(), v: o.value }; }).get();
arr.sort(function(o1, o2) { return parseFloat( o1.t ) > parseFloat( o2.t ) ? 1 : parseFloat( o1.t ) < parseFloat( o2.t ) ? -1 : 0; });
options.each(function(i, o) {
o.value = arr[i].v;
$(o).text(arr[i].t);
});