Variant media grouping (Multiple variant images)

Please note: This feature was added into version 5.1.0 of Showcase & 5.2.0 of Symmetry. In order to enable it, you will need to update your theme to the latest version.

Summary

If a product has a lot of images, it may be useful to only show the images for the current variant. For example, if a product has three variants; red, green and blue, and each color has 10 images, this means there will be 30 images shown on the product page. However with ‘media grouping’ you can show just the 10 images which relate to the current variants’ color.

Please see the video below for a tutorial of this feature:

 

Settings

You’ll need to specify the name of the option with which to group the variants, e.g. Color. This can be found in the Shopify Admin area, where you edit the details of a product.

If your store is multi-lingual and the option name is something else in different languages, you can enter multiple option names and separate options with a comma, e.g. Color,Couleur,Farbe

Image setup

At present Shopify doesn’t allow for having mutliple images for a single variant, so you’ll also need to double check your product images adhere to the following for this setting to work properly.

  1. Ensure all your images are in the correct order such that all the matching ones are together. E.g. in the screenshot below all the red images follow one another, followed by all the white images. Note, the numbering below indicates the order of images in the Shopify Admin area.
  2. Ensure that the first image within each group is associated with a variant. E.g. in the screenshot above, the very first red image (number 1) should be associated with a variant, as should the very first white image (number 7). Once this is done, your variants will look something like this:
Tip: If you have some products which don’t lend themselves well to use Media Grouping, you can create different product templates to use the Media Grouping settings on some products, but not others.