Drupal 8: How to Get Image Style Tokens for Metatags

Created on August 23, 2017 by Jeremiah John
Tags: Drupal 8, Image Styles, metatag, Planet Drupal, Theming
 

It turns out that image style tokens are an easter egg of the regular Token module, ported in from the Imagecache Token module on this ticket.

Image style tokens don't show up in the media browser, and so you sort of have to guess at how to use them. I figured it out by studying the merged commit that added the functionality.

Here's the token string you need, replacing field_my_image_field with your image field's name (which you can get from the field management page of your entity) and my_image_style with your image style machine name (which you can get from the URL of your image style's edit page):

[node:field_my_image_field:entity:field_image:my_image_style:url]

Here's what my metatag looked like: 

[node:field_primary_image:entity:field_image:twitter_card:url]

You can also get the following properties instead of url:

Width:

[node:field_my_image_field:entity:field_image:my_image_style:width]

Height:

[node:field_my_image_field:entity:field_image:my_image_style:height]

Filesize:

[node:field_my_image_field:entity:field_image:my_image_style:filesize]

URI (e.g.: public://styles/my_image_style/public/myfile.png):

[node:field_my_image_field:entity:field_image:my_image_style:uri]

About the Author

Hi. My name is Jeremiah John. I'm a sf/f writer and activist.

I just completed a dystopian science fiction novel. I run a website which I created that connects farms with churches, mosques, and synagogues to buy fresh vegetables directly and distribute them on a sliding scale to those in need.

In 2003, I spent six months in prison for civil disobedience while working to close the School of the Americas, converting to Christianity, as one does, while I was in the clink.