Products grid - Display ''in-stock'' items first.

Hi,

I would like to have out-of-stock products automatically pushed at the end of the product page on the website, regardless of whether they are new, bestsellers, or manually sorted.

Currently, Shopify displays product by de date of creation creating a ‘‘mess’’ for the client experience. This gives the impression that my store has mostly back order item, which negatively affects the customer experience.

I’m looking for a clean way to separate or reorder products so that:

  • In-stock products always appear first

  • Out-of-stock products are listed after

Is there a way to do this via theme customization ?

Here’s a good example ! https://www.districtairsoft.ca/collections/rifle

Thanks in advance for your help!

Hello @districtairsoft

Yes, it’s possible. Which theme are you using? We’ll need to make changes in the theme code.

If your collection has several pages, then you can’t do this fully in theme.

With theme code you can only sort within each page, so your sold out products would be at the bottom, but you can’t make it so that first page contains only available products, while sold out products are pushed to the last pages.

Also, when your visitors first arrive at your collection it is sorted according to the order you’ve selected on collection page when creating collection in admin. So you can set it to “New to Old” rather than “Old to New” as it is now.

There are apps which can sort your collections in back-end, for example https://apps.shopify.com/searchtap-merchandising-app (or similar https://apps.shopify.com/search?q=sort%20collection) which will do what you want.

Great to know ! We use the Dawn Theme for our store.

Dawn !