How to output the 'Alt Text' of a metafield image in Shopify?

Technical Q&A
1

I have created a new metafield for an image file.

I am successfully outputting the image with the following code:

{{ product.metafields.product_fields.full_width_image | image_url: width: 2000 | image_tag: alt:, srcset: nil, class: ‘full-image’ }}

The ‘Alt Text’ is not being output. I’ve followed the instructions provided here and double checked the image does have alt text (doh):

You can use the alt keyword argument to set alt text for the image.

If no value is provided, then the media alt text is used. If no image description is available, then this value will default to an empty string.

Any help appreciated

2

The answer for anyone that struggles with this is :

{{ product.metafields.product_fields.full_width_image | image_url: width: 200 | image_tag: alt, srcset: nil, class: ‘css-class-1 css-class-2’ }}

I had a colon (:slight_smile: after alt.

3

Update to this, leaving the alt off completely returns the alt text used for the image.

{{ featured_image | image_url: width: 200 | image_tag: srcset: nil, class: ‘product-card__image_second’ }}