How to display 'IN STOCK' for any variant in stock?

Hi hoping someone can help with this…

We are looking for some help with a piece of code that we have to show products as in stock/out of stock on the collection grid view. If the product is in stock we simply display it as “IN STOCK” and if it is out of stock we display it as “PLEASE BACK ORDER” (as you can see in image 1). This works great for single products but we have run in to a problem when it comes to variants. You can see in image 2 and 3 that the first variant (LARGE) is out of stock and the second variant (XL) is in stock. The code currently just looks at the first variant to determine which message to display on the collection grid view, but we would like for it to look at all the variants and if any of them are in stock to display the “IN STOCK” message. I have included a screenshot of the code that is in use for this (image 4) and I believe that line 87 of product-card.liquid is what needs changing but cannot figure out exactly how to change it for the desired result. If there is any more information that I can provide to help with a solution for this please do not hesitate to ask as we would like to get this sorted as quickly as we can.

Thanks

Tom

@tomhorton

Please try this code.

{% for variant in product.variants %}
  {% if variant.inventory_quantity == 0 %}
    # Damn Dawg, this variant be out of stock
  {% else %}
    ... whatever....
  {% endif %}
{% endfor %}

Thanks!

Hi Dmwwebartisan, thank you for your reply. Would this be in replacement of line 87?

1 Like

@tomhorton

please add my all code line no 87 check your shop what displaying.

Hi @dmwwebartisan , I have tried the code that you have given and it appears to throw things out of shape on our site when in use. It also appears to show an in stock/out of stock message for every variant so we end up with the message repeated 5-6 times on the product card. All we need is for the “IN STOCK” message to be displayed once if 1 of the X amount of variants is in stock, and if non are in stock to display the “PLEASE BACK ORDER” message. If you need me to provide any more information please let me know. Thank you again for your time in replying.

@tomhorton

This is code customization work Please hire a Shopify Expert.

Thanks!