Multiple variant images (also known as Media Grouping) is a way for you to only display the images/media assets associated with a particular product variant.
For example, when a customer clicks on the 'Red' dress variant, only the images of the red dress are shown. This is aimed at improving the overall customer experience on your store.
Setting up multiple variant images
Enable multiple variant images
- Open the Theme Editor, and select Products > Default product from the dropdown at the top of the page.
- Click on the Product section on the left, and find the MULTIPLE VARIANT IMAGES settings.
- Check Show media only associated with the selected variant.
- Within the Variant option label setting, enter the variant option title for the color of your products. You can find this in the Shopify admin area for each product's variant settings (underlined below).
Setting up product images
The previous steps enables this feature, however for it to work fully, you'll need to arrange your product images in the correct order within the Shopify admin area.
In the Shopify admin area, navigate to Products and pick a product.
Firstly, ensure that the images are ordered with all the same colors grouped together, e.g. the left hand side of the image below:
Secondly, assign first image of each color to a variant. For example below, the first black image of the camera is assigned to the 'Black' variant, etc.
I have product images which I always want to appear, no matter what variant/color is chosen. Can I do this?
Not currently. You'll need to hire a developer to assist with this.
Can I use media grouping for more than one option per product?
No, media grouping will apply to only one variant option per product template e.g. Color or Size.