How do I change the image with a variant selection?

[Kumar2573]

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

{% endif %}

[Kumar2573]

{% for variant in product.variants %} {% if variant.available %} {{ variant.title }} for {{ variant.price | money_with_currency }} {% if variant.price < variant.compare_at_price %} usually {{ variant.compare_at_price | money_with_currency }}{% endif %} {% else %} {{ variant.title }} - sold out! {% endif %} {% endfor %}

[Kumar2573]

{% for variant in product.variants %} {% if variant.available %} {{ variant.title }} for {{ variant.price | money_with_currency }} {% if variant.price < variant.compare_at_price %} usually {{ variant.compare_at_price | money_with_currency }}{% endif %} {% else %} {{ variant.title }} - sold out! {% endif %} {% endfor %}

[Kumar2573]

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

{% endif %}

[Kumar2573]

add js for variant selection

{{ ‘option_selection.js’ | shopify_asset_url | script_tag }}

[Kumar2573]

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

{% endif %}

[Rose_Buddha]

Hi, where do you have to past that in order to change the image, when changing the (color) variant?

[made4Uo]

Hi,

This code would not work if you have a slider or carousel. Anyways. I was able to obtain this with no APP or external library.

If you have Dawn theme or Any Shopify 2.0 FREE themes, this should work. No APPs or EXTERNAL library needed. The code is made to call and listens all the variant options related images. You can have multiple variants options. Works with the Dawn product settings too, that includes thumbnail carousel and even the media size settings.

See video for more information.

6 Steps How To Show Only Selected Variant Images in Product Page - NO APP or EXTERNAL LIBRARY