Add captions or labels to product images

Caution

This is an advanced tutorial and is not supported by Shopify. Knowledge of web design languages such as HTML, CSS, Javascript and Liquid is required. We suggest hiring a Shopify Expert if you are not comfortable proceeding with the following tutorial.

Product images don't have metadata that could be used as captions in your Liquid templates. You can work around this by using the product image filename to come up with a descriptive caption using Liquid filters.

Adding an image caption using Liquid

When each product image illustrates a variant (and only one image does), and when your product images are dragged and dropped in the same order as your variants are listed, you can use this Liquid for your image caption:


{% for image in product.images %}
...
My image caption is {{ product.variants[forloop.index0].title }}
...
{% endfor %}

The variant title becomes your image caption.

Want to discuss this page?

Visit the Shopify Community