Show only images related to the selected variant

This feature displays only the images associated with the selected variant, creating a more relevant and streamlined shopping experience for your customers. Follow this step-by-step guide to set it up

Prerequisites *

Before setting this function, make sure:

• Your product has color/image variants (e.g., Red, Blue, Green).

• Your product has image thumbnails of different colors/models.

Demo

Before group image

After group image

Step-by-step configuration

Step 1. Group image thumbnails by color

First, in the Shopify Product Admin you need to rearrange the order of all images in the product image list by group.

E.g: White, Pink, Black, Green

Group image thumbnails

Group image thumbnails

Step 2. Sort variants and group by color

• Once the image group is complete, scroll down to the variation options

• Reorder variants, variant option displayed as image or color must be placed on top

Sort variants and group by color

3. Select image for main variant

Make sure the main image variant is the first image of a group

Select image for main variant

Select image for main variant

Make sure all primary image variations in a group are the first image of a group, no photo can be different main image

Select image for main variant

4. Sync data in the Globo Color Swatch app

• After setting up the group image for all products, go back to our app.

• Click the Update data button to sync these latest changes.

5. Set Color/Image display style for variant

To use this feature, your variant option must be displayed as a Color Swatch or Image Swatch. Variant types such as Dropdown and Button do not support image grouping.

List of styles that support group image function:

✅ Swatch

✅ Pill swatch

✅ Automated swatch

✅ Image swatch with price

✅ Custom swatch with price

✅ Swatch dropdown

✅ Image dropdown

❌ Button (all style button)

❌ Button with price (basic)

❌ Dropdown (basic)

6. Enable the Group image function

• Navigate to the Settings section

• Check on the Group image checkbox

• Select a Shopify theme that you're using on your store.

• Click Save to finish.

7. Result

When a variant group is selected, all images that do not belong to that group will be hidden, ensuring that customers only see images relevant to the selected variant.

Group image by color green

Group image by color pink

Video guide

Video guide

---

Group image still not working?

1. Check your Theme Customize settings:

Some themes include a built-in feature called "Hide other variants’ media after selecting a variant."

If you're using the app's Group Images feature, please go to Online Store → Themes → Customize and disable this theme setting.

The theme's media filtering feature may conflict with the app's Group Images functionality, which can prevent images from displaying correctly.

2. Contact us

Some newer theme versions may not support this feature yet. If you've followed the setup instructions and it's still not working, please contact our support team for assistance.

For further help, reach out to us at [email protected].