Automatically changing the order of variant options on product pages basked on the stock?

Is there any way/app to reorder my variants on the product page based on the stock availability Automatically

When the customer lands on the product page if the default variant is OOS, It confuses them, To avoid this issue I would like to showcase the first product variant always with instock

There would certainly be some app available but if you are a developer then it’s fairly easy to implement. Probably a 2-3 hour job.

I’d not advice adding an app for this because it will add a lot of bloat to your website.

If you want to develop it here’s how to do it.

  • Find the section in liquid which displays variants and comment it
  • Add liquid code to sort the variants based on stock
  • Take the loop from commented code and pass in the sorted array of variants from previous step

DM me if you need help