Shopify themes, liquid, logos, and UX
To continue receiving payouts, you need to secure your account by turning on two-step authentication. If two-step authentication is not turned on your payouts will be paused. Learn more
Hello community,
We wanted to add a "best seller" badge to a specific product variant. We did it, we know it works static, but I can't move my head around the for loops.
So, shopify creates the front-end variants using the following piece of code:
{%- for option in product.options_with_values -%}
<fieldset class="js product-form__input">
<legend class="form__label">{{ option.name }}</legend>
{%- for value in option.values -%}
<input type="radio" id="{{ section.id }}-{{ option.name }}-{{ forloop.index0 }}"
name="{{ option.name }}"
value="{{ value | escape }}"
form="product-form-{{ section.id }}"
{% if option.selected_value == value %}checked{% endif %}
>
<label for="{{ section.id }}-{{ option.name }}-{{ forloop.index0 }}">
{{ value }}
</label>
{%- endfor -%}
</fieldset>
{%- endfor -%}
After the for is ended, we want to take ONE input (if input.value= 18 x 24 -> rewrite label WITH our div inside)
We want to add a div within the <label>, in order to attach the "best seller" text right into it
The result should be the following:
We don't want to add another variant, just take the one 'liquid for' generated and rewrite the label inside it.
Or, more simple than that, if the label value = 18 x 24 -> rewrite the label with our div inside
We are 100% this should be very easy to accomplish, but we are beginners in Liquid. I hope I explained very detailed and I hope you understood
Thanks in advance.
Solved! Go to the solution
This is an accepted solution.
Hey guys. I did it.
I am pasting it here in case anyone wants to use it:
This is an accepted solution.
Hey guys. I did it.
I am pasting it here in case anyone wants to use it:
User | RANK |
---|---|
113 | |
90 | |
70 | |
66 | |
46 |
Learn these 5 things I had to learn the hard way with starting and running my own business
By Kitana Jan 27, 2023Would you love to unleash the unbridled power of the Google Shopping Channel into your sho...
By Gabe Jan 6, 2023How can you turn a hobby into a career? That’s what Emmanuel did while working as a wa...
By Skye Dec 30, 2022