Shopify themes, liquid, logos, and UX
I'm trying to achieve image swatch on dawn theme using this code but its showing 1st image for all variants and if i use different code its shows different image but it is not clickable
{% if product.variants[forloop.index0].image != blank and option.name == 'Color' %} <label class="color-lable" for="{{ section.id }}-{{ option.position }}-{{ forloop.index0 }}" style="background-image: url( {{ product.variants[forloop.index0].image | img_url: '' }} );"> </label> {% else %} <label for="{{ section.id }}-{{ option.position }}-{{ forloop.index0 }}"> {{ value -}} <span class="visually-hidden">{{ 'products.product.variant_sold_out_or_unavailable' | t }}</span> </label> {% endif %}
{% if option.name == 'Color' %} {% assign found = false %} {% for variant in product.variants %} {% for opt in variant.options %} {% if opt == value %} {% if found == false and variant.featured_image %} <label for="{{ section.id }}-{{ option.position }}-{{ forloop.index0 }}" style="background-image: url({{ variant.featured_image | image_url: width: 40 }});"> </label> {% assign found = true %} {% endif %} {% endif %} {% endfor %} {% endfor %} {% else %} <label for="{{ section.id }}-{{ option.position }}-{{ forloop.index0 }}"> {{ value -}} <span class="visually-hidden">{{ 'products.product.variant_sold_out_or_unavailable' | t }}</span> </label> {% endif %}
2nd code result but image is not clickable
Hi,
Can you share your store url
https://h3pdbp5jbwmpbcri-67056402651.shopifypreview.com/products/floral-cotton-notch-collared-dress?...
IF there is no size variant the its working fine and its also clickable but by adding size variation the code is not working properly
Hi,
Link is not working
i got the solution thanks for your time
you should share the solution with us
Yes, understanding your solution would be very helpful to others.
You just need to follow this video step by step.
Without installing any App:
Hey @MRamzan this is really helpful. However, I have multiple variant pickers and I would like to have image pickers for all variants.
Hey Community! As the holiday season unfolds, we want to extend heartfelt thanks to a...
By JasonH Dec 6, 2024Dropshipping, a high-growth, $226 billion-dollar industry, remains a highly dynamic bus...
By JasonH Nov 27, 2024Hey Community! It’s time to share some appreciation and celebrate what we have accomplis...
By JasonH Nov 14, 2024