How can I display color variant images in my online store?

Shopify Discussion
1

How to implement a shop where I’ll have products with several color variants. So I was wondering if it’s possible, inside the collection page, to change the product image when a filter is applied in order to show that particular variant.

Let’s say my product option is from the filter selected “color” is “BLUE” Is it possible to filter by color (blue for example) and show the product image from variants related to the chosen color?

Help appreciated.

Thanks,

Nitin

2

It is very simple, normally this is already implemented in the theme.

You will need to find the product grid liquid and change the image URL as example below
{% assign url = product.first_or_selected_variant.featured_image.url %}

Or maybe trying this app, it is automatically implemented in the app https://apps.shopify.com/ultimate-search-and-filter-1

3

Absolutely INSANE to me that Shopify has not fixed this problem across all shops and themes. It’s so simple… Make it so that people can select the images they want for the specific variant

1 Like
4

You can display selected color images:

5

Hi @nitinj

II hope you are well! :slightly_smiling_face:

There is a new app which helps users for the exactly what you are looking for!

Rubik Variant Images, allows users to select variant specific images to filter on store front.

You can see the demo video here: https://youtu.be/rRWPNsRw8lM?si=vQyVlvU9eMYRbmcq

And the app team is super helpful. They try to help each user from live chat. I suggest to give a try :slightly_smiling_face:

1 Like