{% if product.variants.size == 1 %} doesn't work with more than one product option

Shopify Discussion
1

Hi everyone,

I’m trying to hide product option if there is only one variant.

I tried with this code :

{% if product.variants.size == 1 %}

But it doesn’t work when I have two product options. The result of :

{{ product.variants.size }}

is always the size of the second product options.

For example if my product has:

  • Color : Red
  • Size : S - M - L

{{ product.variants.size }} for Color display 3 (instead of 1)

{{ product.variants.size }} for Size display 3

I use Venture theme and my full code is:

            {% for option in product.options_with_values %}
            --{{product.variants.size}}--
              <div class="selector-wrapper js product-form__item">
                <label {% if option.name == 'default' %}class="label--hidden" {% endif %}for="SingleOptionSelector-{{ section.id }}-{{ forloop.index0 }}">{{ option.name }}</label>
                <select class="single-option-selector single-option-selector-{{ section.id }} product-form__input"
                  id="SingleOptionSelector-{{ forloop.index0 }}"
                  data-name="{{ option.name }}"
                  data-index="option{{ forloop.index }}">
                  {% for value in option.values %}
                    <option value="{{ value | escape }}"{% if option.selected_value == value %} selected="selected"{% endif %}>{{ value }}</option>
                  {% endfor %}
                </select>
              </div>
            {% endfor %}

Any idea? Thx

2

I did it with jQuery but I would like a better alternative…

$(document).ready(function() {
  $("select[id^='SingleOptionSelector-']").each(function () {
      var optionCheckSize = $("option", this).length;
      if(optionCheckSize == 1) {$(this).parent().hide()};
  });
});
3

Up!

4

Up! Is there a solution to my problem?

Thanks

5

Just a thought.
Wouldn’t your total variants be 3 in this case - S,M,L sizes of the Color Red.
If you have 2 Colors - should the total variants be 6.

Try this:

{%- for option in product.options_with_values -%}

{%- if option.values.size == 1 -%}
– YOUR LOGIC –

6

use this to get the options size

{{product.options.size}}

7

Hi,
This code gives you a only color variat size.

-just make sure that your variant name should be “colour” in this case

{%- for option in product.options_with_values -%}
{%- if option.name == ‘colour’ -%}
{{ option.values.size }}

{%- endif -%}

{%- endfor -%}