All things Shopify and commerce
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:
{{ 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
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()}; }); });
Up!
Up! Is there a solution to my problem?
Thanks
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:
use this to get the options size
{{product.options.size}}
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 -%}
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024