Setup multiple images associated with one variant via Metafield

Shopify lets you attach one featured image to each product variant. This works well for simple products, but it can be limited when one variant needs to show multiple gallery images.

For example, a product may have several color variants, and each color needs its own group of images in the product media gallery.

In Concept, you can use the variant metafield theme.gang_media to assign multiple media items to a specific variant. When customers select that variant on the product page, the product gallery will display only the media assigned to that selected variant.

Overview

By default, Shopify allows one image to be linked to each variant. The Gang media feature extends this behavior by letting you assign a list of media files to each variant.

This is useful when each variant needs its own gallery, such as:

• Color-specific product photos
• Material-specific product photos
• Style-specific product photos
• Variant-specific lifestyle images
• Variant-specific detail images

The theme checks the selected variant and looks for the following variant metafield:

theme.gang_media

If the selected variant has media assigned to this metafield, Concept uses those media items as the active gallery for that variant.

Example:

Important:

The media selected in the theme.gang_media metafield should come from the same product media library. If the selected files are not part of the product media gallery, the theme may not be able to match and display them correctly.

How to Set Up Multiple Images for One Variant

STEPS:

Step 1: Create the Gang media Variant Metafield

First, create a variant metafield that stores the media items for each variant.

From your Shopify admin, go to Settings > Metafields and metaobjects.

Open Variants, then click Add definition.

Enter the metafield name:

Gang media

After you enter the name, Shopify will automatically recommend a Namespace and key.

Click the suggested Namespace and key value if you want to edit it manually.

Change the namespace and key to:

theme.gang_media

For the metafield type, choose File and set it to allow a list of files.

In Validations, choose Images if you only want to assign image files.

Click Save.

Recommended setup:

Field	Value
Name	Gang media
Namespace and key	theme.gang_media
Type	File
Value type	List of files
Validation	Images

After saving, the new Gang media metafield will be available on your product variants.

Important:

The namespace and key must be exactly:

theme.gang_media

If the namespace and key are different, the theme will not detect the metafield automatically.

Step 2: Open the Product You Want to Configure

After creating the metafield, open the product where you want to assign multiple images to each variant.

From your Shopify admin, go to Products.

Open the product you want to configure.

In this example, we use the Flow Harmony product.

Before assigning media to variants, make sure all images you want to use have already been uploaded to the product media gallery.

Important:

The selected Gang media should be part of the current product media library. For example, if you are configuring the Flow Harmony product, select media from the Flow Harmony product media library.

Step 3: Assign Media to a Variant

Next, assign a group of images to each product variant.

On the product edit page, scroll down to the Variants area.

Click the variant you want to configure.

For example, click the Gold Tone variant.

Scroll down to the Metafields area.

Find the Gang media metafield, then click Select files.

Important:

• Select the images that belong to the current variant.
• Do not select images for other variants.
• The selected images should already exist in the product media library.

Step 4: Filter Files by Product Media

When the file selector opens, Shopify may show many files from your store. To make the setup easier, filter the files by the current product.

In the file selector, select Product.

Search for the product name.

Example:

Flow Harmony

Select the correct product.

After filtering by product, only the media from that product will be displayed.

Select the images you want to assign to this variant.

Click Done.

Click Save.

Repeat the same process for the remaining variants.

Example setup:

Variant	Media to select
Gold Tone	All Gold Tone product images
Black	All Black product images
Chestnut	All Chestnut product images

Step 5: Preview the Product Page

After assigning media to your variants, open the product page on your storefront.

Check the following behavior:

• When you select a variant, the product gallery updates automatically.
• Only the images assigned to the selected variant are displayed.
• The thumbnail gallery also updates to match the selected variant.
• Other variant images are hidden from the active gallery.

No additional theme editor setting is required. Once the theme.gang_media metafield is created and filled in, Concept will detect it automatically.

Step 6: Notes and Limitations

Please note the following behavior:

• This setup works at the variant level, not the product level.
• The metafield must be created under Variants.
• The namespace and key must be exactly theme.gang_media.
• The metafield type must allow a list of files.
• The selected media should come from the current product media library.
• If a variant has no Gang media assigned, the theme will fall back to the normal product media behavior.
• If a variant has Gang media assigned, the theme will only show the media selected for that variant.
• You need to repeat the media assignment for each variant that should have its own image group.
• This feature does not create new variant images in Shopify. It only controls which existing product media items appear when a variant is selected.

---

Troubleshooting

If the variant media does not update correctly, please check the following:

• Make sure the metafield was created under Variants, not Products.
• Make sure the namespace and key are exactly theme.gang_media.
• Make sure the metafield type is File and supports a list of files.
• Make sure the selected files are part of the same product media library.
• Make sure each variant has the correct images selected in the Gang media metafield.
• Make sure you clicked Save after assigning the media.
• If the wrong images appear, remove the incorrect files from the variant metafield and select the correct product media again.
• If no images appear for a variant, check whether the selected files are attached to the product media gallery.
• Clear your browser cache and refresh the product page.
• Make sure you are using Concept v4.1.0 or later.

---

Need Further Assistance

If you encounter any issues or need additional help with your Concept theme, please reach out to our support team via our Ticket System for assistance within 8 hours.