Show only relevant variant images on thumbnail when clicking a color swatch

This feature allows you to show variant images as swatch option.

Steps:

Upload variant images

1. From Shopify admin page, go to Products
2. From All Products > edit the product you want to upload variants’ image
3. Upload variants’ images (see screenshot)
4. Click Save

Note: After adding/updating your products variants in Shopify Products, please sync product data

Show variant image group

1. From Shopify admin page, go to Products
2. Select a particular product you need to upload the variant images
3. Upload variants’ image in the order as the screenshot below (Order: Grey variant image –> the rest images of Grey group –> New Cream variant image –> the rest images of New cream group –> Pink variant image –> the rest images of Pink group)

Note: the rule is that the same color images MUST be together and the main variant image is on the top of its image group

Because the image group function verifies the group of images shown up by checking the main variant image position and taking list of images from that main image to the last image that is next to the next main variant image

Enable the image group function in the app backend

1. From the app admin page, click Settings
2. Turn on the setting Group image when click swatch
3. Click Save to apply the changes

Here is the result in the front end:

Video tutorial

This feature heavily depends on your theme functionality, so if it does not work as expected, don’t hesitate to email us at [email protected]!