Assigning multiple images to each colour variant of bag 'front' and 'back'

Shopify Discussion

Topic summary

A Shopify store owner is experiencing an issue with product image display for tote bags available in multiple colors.

The Problem:

  • Each color variant has been assigned a ‘front’ image, but only the ‘back’ images are displaying on the product page
  • This makes it appear as though only one design exists
  • The assigned front images are missing from the image scroll/gallery

Requested Solution:
The user is seeking code to assign multiple images (both front and back) to each color variant, ensuring that when a color is selected, only that color’s images are shown.

Current Status:
A developer (Shadab_dev) responded offering a solution they’ve previously implemented where selecting a variant displays only that variant’s images. They provided a reference site example and invited further collaboration via email. The original poster has accepted the help and sent a private message to continue the discussion.

Summarized with AI on November 4. AI used: claude-sonnet-4-5-20250929.
1

Hello everyone!

I have tote bags in my store in different colours. I have assigned an image of the bag ‘front’ colour to each variant, but the product page is only showing the bag ‘backs’ (and not the assigned front images) which make it look like that’s the only design.

Please see image attched. The images assigned to ‘front’ bag colour variants are missing from the image scroll.

What’s the code to assign multiple images to each colour variant (bag front and back), and make it

only show the images of that colour ?

Thank you so much!

Sonya

Screenshot 2024-11-09 at 07.44.00.png
Screenshot 2024-11-09 at 07.44.00.png2274×1368 365 KB

2

I was able to implement something like this where you will get images of only the selected element or variant of a product.

So for white only white colour bags, for yellow only yellow bags, etc. please see reference site of a client.

www.kpsclothing.in

If you are looking for anything like this, please reach out via mail for a convenient conversation and collaboration.

Best

Shadab

1 Like
3

Thank you so much Shadab_dev! I’d love your help. I’m sent you a private message :slightly_smiling_face: