Trying to hide variants that are out of stock

Here is my theme info:

Shopify.theme = {“name”:“C2”,“id”:121191366815,“schema_name”:“Icon”,“schema_version”:“7.4.2”,“theme_store_id”:686,“role”:“main”};

I’m trying to hide variants that are out of stock. I don’t want the entire product to be hidden, but if 1 variant is out of stock I want that variant to be hidden, while the other variants in that product that have stock stay visible.

Thank you!

Hey! @eyeweardesigns ,

You can achieve this by customizing your theme’s JavaScript or Liquid code to hide out-of-stock variants from the variant selector (like a dropdown or buttons). This way, the product still shows on your store, but only the variants with available stock are visible to customers. This typically involves checking the variant’s available property and hiding the options that are false. Let me know if you need help applying this to your specific variant selector type.

Thanks for the information. I would like some help applying this as this is not something I’ve had to edit before. Thank you!

Could you kindly share your store URL and password (if it’s password-protected) so I can review it and provide you with an update?

@eyeweardesigns For this functionality you need to find product template in your theme and look for the for-loop for product variants. I am attaching code which will help you implement the functionality.

{% for variant in product.variants %}
  {% if variant.available %}
    
    
  {% endif %}
{% endfor %}

You might need coding skills to update the code to implement the functionality. If not, your best bet is to hire a Shopify partner to implement the functionality for you.

Hi @eyeweardesigns

Would you like to share the link to product page?

Stamp – Variants on Collection helps display product variants separately on collection and homepage layouts, and allows you to show or hide specific variants. It might be useful for your use case.

There’re also 3rd party apps that does it without coding