How to completely hide sold-out products in collections 🫣

If your store is frequently running out of stock on certain products, it may be a good idea to completely hide sold-out products from your collection pages. By doing so, you ensure customers only see available products, making their shopping experience smoother and more efficient.

Why hide sold-out products? 🧐

Nobody likes seeing something they want, only to realize it’s out of stock. Hiding sold-out products entirely improves the browsing experience by displaying only what’s available. This can lead to higher conversion rates, as customers can focus on what they can actually purchase without distractions.

What are your options?

• Using apps from the App Store 💰 There are apps in the Shopify App Store that let you automatically hide sold-out products. However, many of them require ongoing monthly fees and can complicate your collections by creating additional settings or collections in your store admin.
• Theme code modification 👨‍💻 A better solution is modifying your theme’s code directly. It’s free, easy, and gives you full control over how sold-out products are displayed—or in this case, not displayed!

How to hide sold-out products for free?

1. Copy the code snippet below 👇🏻
2. Open your collection template, often found as collection.liquid, main-collection.liquid, or main-collection-product-grid.liquid.
3. Locate where products are being listed with a line like {"{% for product in collection.products %}"}.
4. Replace the code with this updated version and save the file.

{% assign available_products = collection.products | where: 'available' %}

{%- for product in available_products limit: section.settings.products_count -%}
<!-- Your code for displaying available products -->
{%- endfor -%}

All done! 🎉

By hiding sold-out products, you create a more streamlined shopping experience for your customers. They will only see items that are ready to purchase, reducing frustration and improving overall store navigation.

Looking for more tips to optimize your Shopify store? Check out our other guide: How to move sold-out products to the end of the list, where you can learn how to reorder your collections to display sold-out products at the bottom.