Dawn theme - Select a product variant by clicking its image

[saitek]

Hi!

I am using the Shopify Dawn theme on my website. On product page, I would like to be able to select a variant by clicking on the corresponding image, At the moment, it is only possible the other way around - clicking on the variant and getting the corresponding image. Can anyone assist on this?

Thanks!

[Dawood_Mirza_]

Hi @saitek,

Yes, that is definitely possible. You can assign images to specific variants through the product page. Here’s how:

1. Go to the product page in your Shopify admin.
2. After each variant, you will see an option to add images.
3. Assign the desired images to the corresponding variants.

If you need any further assistance, please let me know.

Best regards,

Dawood Mirza

[saitek]

Hi @Dawood_Mirza_, thanks for the quick reply.

Sorry for not being clear. Let me give you an example from our store. On this page https://alusitana.com.pt/products/fio-de-la-para-arraiolos-a-lusitana, we would like for customers to be able to select a color from the images and get the corresponding color reference from the dropdown menu. 

At the moment, whatever picture you click on you will get the color reference "1".

[Dawood_Mirza_]

Hi @saitek,

Sorry I also misunderstood your query, the thing you are wanting ( Selecting image selects the respective variant ) is a complex request, so you will need a lot of steps to change it, it will be difficult for someone to guide you in detail over here.

Even I would do it for first time so many hit and trials would be there.

As far as I know, all current tutorials only support vintage Shopify themes, and doesn't apply to Online Store 2.0 themes.

First you need to change it to show thumbnail image slider, refer video: https://www.youtube.com/watch?v=ZbDOiC9T3Ik

Next, you need to add custom JS to help change the variant, for this I recommend hiring someone.
Or use some apps.

Hope it helps!

[umidaydemir]

Hi!

You can try the Rubik Variant Images app. It ensures that only the images corresponding to the selected variant are displayed.

Hope this helps!

https://apps.shopify.com/rubik-variant-images/