Hello,
We are having trouble editing the code to get the variant images we have to automatically be placed as the swatches instead of the plain colors. I feel like we are almost there but for some reason our code only populates the same image for all the variants in the swatches instead of the specific images for each variant. Please see modified code below:
{%- assign swatch_file_extension = ‘png’ -%}
{{ option.name }}
{%- if is_color -%}
—
{{ option.selected_value }}
{%- endif -%}
{%- assign option_index = forloop.index -%}
{{ option.name }}
{%- for value in option.values -%}
{%- liquid
assign product_available = true
if product.options.size == 1
assign product_available = product.variants[forloop.index0].available
endif
-%}
{%- for variant in product.variants -%}
{%- unless values contains value -%}
{%- liquid
assign values = values | join: ','
assign values = values | handle | append: ',' | append: value
assign values = values | split: ','
-%}
{%- if is_color -%}
{%- liquid
assign color_image = value | handle | append: '.' | append: swatch_file_extension | asset_img_url: '50x' | prepend: 'https:'
assign color_swatch_fallback = value | split: ' ' | last | handle
-%}
{{ value | escape }}
{%- else -%}
{{ value | escape }}
{%- endif -%}
{%- endunless -%}
{%- endfor -%}
{%- endfor -%}
I am not sure what we are doing wrong with this or what we have left to add here. Can we please have some help on this? It would be very much appreciated.
Also, we would like these swatches with the variant images to be also on the collections pages