How to move out-of-stock products to the end of collection without using an app

Store Design
,
1

Hi everyone,

I want to display out-of-stock products at the end of my collection page.

Currently, we are using an app/plugin to push sold-out items to the bottom, but I would like to achieve this without any app, using Shopify’s default features or theme customization.

My requirement:

  • In-stock products should appear first

  • Sold-out products should automatically move to the bottom

  • This should work dynamically when stock changes

My store details:

  • Collection link: V Neck Kurti

  • Theme name: Minimalista

  • Inventory tracking is enabled

I checked collection sorting options but didn’t find a way to sort based on stock status. Is there any Liquid code, setting, or workaround to do this natively?

Thanks in advance!

2

No.
This cannot be done in liquid and needs to be done in back-end and only for “manual” sort option by re-sorting products in collection.
When changing sort order in front-end sold products will be re-positioned according to the new sort order.

Potentially, it should be possible to achieve with free Shopify app Flow, but there is a bunch of paid apps to do that, some may be not expensive.

3

Hi @Aarni

Yes, this is possible, but it requires custom code.
By modifying the collection template (Liquid), we can:

Display in-stock products first
Move out-of-stock products to the bottom
Have it update automatically when inventory changes

Best regards,
Devcoder :laptop:

4

Hi @Aarni ,

Agree with @devcoders , it can be done but it does require modifying your collection template.