Variant Image Grouped

Below is the step by step instruction to set up Variant image grouped.

Create a Metafield for variants:

  1. From your Shopify admin, go to Settings -> Custom data.

  2. Click Variants → Add definition.

3. Please enter correct Namespace and Key as we noted below.

Name: Variant Image Grouped or any name.
Namespace and key: custom.variant_image_group
Select content type: Multi-line text

How to insert content for Variants Metafields?

  1. From your Shopify admin, go to Products -> All products.

  2. Find and choose the product that you want to edit.

  3. Click on the image -> Click Add alt text -> Enter the alt text that you want for the image -> click Save alt text.

  1. At "Variants" click on the variant you want.

  1. In the Metafields, please enter the alt text of the images you want show for this variant on the Variant Image Grouped input.

Set up Variant Image Grouped

  1. From your Shopify admin, go to Online Store -> Themes.

  2. Find the theme that you want to edit, and then click Customize.

  3. Choose Default product template in the dropdown of editor window to open theme editor of product page.

  1. From Product Information -> Click Add block -> Choose Variant Picker.

  1. Choose Show Variant Image Grouped? to enable Variant Image Grouped function.

Here is the result:

If you want to have this feature on Quickview, please go to Theme Settings -> Quickview -> Show Variant Image Group?.

We have just updated a new setting for the "Variant Image Group". You can use Metafields to show "Variant Image Group" for each product. (This feature will allow for better SEO optimization compared to the old settings. This setting will take priority over the old one, if you do not set up the "Variant Image Group" using Metafields, it will remain as per the old settings.)

Last updated