Hi, Just wondered if anyone can help me out as I am struggling to find a way to edit the code on my dawn theme 15.0 so that the different colour variants are assigned to different product images, so that if the customer clicks on the orange colour, the orange product will appear on screen instead. …

I downloaded a new dawn theme just to see what the default settings are. Most of what I showed you can be done without any code. The part that will require code (as far as I know) is showing the main photo first by default. So I did notice if you use the same photos for your variants and your featur…

Hi Shadab, That worked perfectly! However, I didn’t realise I had to replace the code with yours. I thought I had to add it on at the bottom but then I tried replacing all of it with your code, then it worked! Thank you so much! I bought you a coffee too with your link! Thank you again for your …

[Blue.png] [Red.png] yes, we are talking about both the product layout uploaded through product media and the variant swatches.

@kpsclothing I dont think there’s any change needed to the swatches. The number of colors you have in your color variant only that much swatches will show up, it does not get duplicated. Challenge is to not show all the products on selection of a particular variant color and I am going to update th…

Hi @Vegan_Stallion all is well that ends well, ri8? Glad it worked for you and it was what you were looking for. Thank you for that tip means a lot Let me know if you need any further help regarding code, theme customization, a bit of design stuff. You have my email. Thank you again for that tip …

@kpsclothing Let me take you through the steps. There are three steps watch out for it. ////// First step ///// First give your product images alt text from the product admin. [Shadab_dev_0-1720275457298.png] [Shadab_dev_1-1720275457886.png] So for a white product write white and for a red re…

@kpsclothing great it worked. Yeah that is achievable. Will update you. Please do mark the previous one as a solution Thanks

@kpsclothing its done alhamdulillah. No multiple steps in this one. Just open your product-variant-options.liquid file and replace this code. {% comment %} Renders product variant options Accepts: product: {Object} product object. option: {Object} current product_option object. block: {Object} …

The code is not working on Trade theme and on Dawn theme.

Refresh is not happening on mobile view.

How do I assign colour variant to product image for that specific colour on dawn theme 15.0 - code

Shopify Discussion

kpsclothing July 6, 2024, 3:35pm 39

Thank You, the code is working!

Also, can we have the color option as variant image in variant picker?

Topic		Replies	Views
Variant based image switching Technical Q&A shopify-themes	5	65	May 7, 2026
onVariantChange class is not there in Shopify Dawn 15.0.0. Shopify Discussion troubleshooting , shop-performance	14	221	August 19, 2024
Add image Gallery In product variant Shopify Discussion customizations , shopify-themes , product-page	22	184	May 7, 2026
Colors variants on product page. Dawn 15 Store Design design , customizations , product-page	0	170	July 29, 2024
Show Featured Product Image Instead Of Selected Variant Image, Dawn Theme, V12.0.0 Store Design design , customizations , shopify-themes	4	98	December 26, 2023

How do I assign colour variant to product image for that specific colour on dawn theme 15.0 - code

Related topics