Skip to main content

Dynamic images

Show product featured images, media, and metafield images that follow Shopify data.

Dynamic images change with the connected Shopify resource instead of using a fixed file. Use them for product templates, collection banners, and merchandising sections where the image should match the product or collection on screen.

Set a dynamic image source

  1. Select an Image element and open the image control from the Design panel or the canvas toolbar.

  2. Instead of picking a file from your assets, choose a dynamic source.

The dynamic sources depend on the connected resource:

  • Featured image — the product's or collection's main image

  • Media — a specific item in the product's media gallery, listed as Media 1, Media 2, and so on

  • Metafield images — file-reference metafields on the resource that point to an image, listed by the metafield's name

Image fills

You can also drive a background through Fill in the Style section: set the fill type to Image and pick a dynamic source the same way as a standalone image element.

Metafield images

When a file-reference metafield resolves to an image, it appears as a dynamic option labeled with the metafield's name. This is useful for size charts, alternate angles, or badge artwork stored per product. See Use metafields.

Static Shopify files vs. dynamic sources

A file picked from your assets is static — the same image on every product. A dynamic source resolves per resource at render time. Use static files for brand assets that never change, and dynamic sources for catalog imagery that should follow the product or collection.

Sizing and quality

Sizing, focus point, and quality controls apply the same way to static and dynamic images, so a dynamic source inherits the treatment you set on the element.

Check it in preview

Connect a product or collection and preview with real store data to confirm that gallery positions and metafield images resolve. Switch products in preview to make sure the image follows context. If a slot is empty, check that the product has media at that position, or that the metafield is populated in Shopify admin.

Related articles

Did this answer your question?