Shopify themes, liquid, logos, and UX
Hi all,
I followed this instruction (https://shopifytheme.blog/multiple-variant-images-in-shopify/) in order to make my variants display their selected images only on my product page. However, after creating new metafields and editing the codes, variant images didn't appear when selected. Can someone help me to troubleshoot this?
I'm on Dawn 15.3.0
Link: https://0h7rnawa3ilg7msd-58952089718.shopifypreview.com
Product Name: Dogpack
Thank you!!
shopify only lets you assign one image per variant by default but you can totally make it work with a little extra code
what you do is assign multiple product images with the same alt text or use a naming system that links them to the variant like all the red variant images have "red" in the alt or filename
then in your theme you write a lil JavaScript that listens for the variant change and shows only the images that match that variant and hides the others
you can also use app liek Variant Image Automator if you don’t wanna code it out but if you want to do it yourself it’s something like this
first give your images a naming pattern like
red-shirt-1
red-shirt-2
blue-shirt-1
blue-shirt-2
then in your code
when the variant changes
you loop through the images and check if the filename or alt matches the variant name and then show/hide accordingly
If this fixed your issue, likes and accepting as a solution are highly appreciated
| Build an online presence with our custom-built Shopify Theme: EcomifyTheme
| Check out our reviews: Trustpilot Reviews
| We are Shopify Partners: EcomGraduates Shopify Partner
Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025Discover opportunities to improve SEO with new guidance available from Shopify’s growth...
By Jacqui May 1, 2025