1
votes

I'm trying to display the sizes of the products on the product card so that the customer won't have to click on the product to find out which sizes are in stock. If the size is in stock, the size will have different styling to the sizes without stock.

What I have at the moment:

{% assign sizes = '' %}
  {% for variant in product.variants %}
      {% assign sizes = sizes | append: variant.options[0] | append: '_' %}
  {% endfor %}
  
{% assign sizesArr = sizes | split: '_' | uniq %}

{% for size in sizesArr %}
  <span>{{ size }}</span>
{% endfor %}

This shows all the sizes of the product. The problem is the code doesn't distinguish between the sizes that have stock and those that don't, so I can't change the styling between the two.

Thanks in advance.

1
your product has 1, 2 or 3 level variations?Onkar
Some products have 1 variation (size) and some have 2 variations (size and color)BoJack
in a single variant, it is easy to get the stock, but in combination is harder to determine, due to size combination with other colors.Onkar

1 Answers

0
votes

This cheat sheet will help you, shopify Cheat Sheet

There is variant.inventory_quantity will you need to use to determine the stock.

{% for variant in product.variants %}
  {% assign sizes = sizes | append: variant.options[0] | append: '_' %}
{% endfor %}

you need to check if a product has variants or not. then proceed when there is a variant. because there can be multiple product variants option.

{% for variant in product.variants %}
{% for option in variant.options %} 
      my stock is {{option.inventory_quantity}}
{% endfor %}
{% endfor %}