How do I get a product's slideshow gallery to automatically switch to the correct variant image?

Featured links

1. Shopify documentation on adding images to product variants
2. Company XYZ documentation on Using images in Align

Assign an image to each product variant in Shopify, then choose how Align updates the product gallery when a customer selects that variant.

Assign variant images

1. In the Shopify admin, open the product.
2. In the variant list, select the image thumbnail beside a variant.
3. Choose an existing product image or upload a new one.
4. Repeat for each variant, then save the product.

You can assign the same image to multiple variants—for example, the same red product image across all red size variants. Shopify supports one assigned image per variant. See Shopify documentation on adding images to product variants for more detail.

Choose the gallery behavior

1. Open the product template in the theme editor.
2. Select the Product information section and make sure it contains a Variant selector block.
3. Find Gallery variant image style and choose:
   • Default to show the selected variant image first.
   • Variant only to show only the selected variant image.
   • None to leave the gallery unchanged when a variant is selected.
4. Save and test several variants on the storefront.

For guidance on preparing product imagery, see Using images in Align.

Example

This screencapture shows how to assign a variant image in Shopify:

Note

If the gallery does not respond to variant changes, first confirm that the Product information section includes a Variant selector block.