Apparently there are still pretty common Drupal 8 theming tasks that cannot be accomplished with the great twig_tweak module. This by the way was me giving a plug to a great little module, which makes half of all your theme preprocess hooks unnecessary.
Update: Apparently there is a module like twig_tweak but with the ability to do the above. It is called bamboo_twig and its documentation can be found here - thanks to Luckhardt Labs for mentioning it. Mind you I have not tested it yet. There is a rather interesting issue in its queue about the lack of collaboration between the two module maintainers.
If you would like to get the URL from an image that is trapped inside of a media entity however, you can either extract it using the aforementioned preprocess function like so:
In the node template, you can display it using
... or use this nifty snipplet inside of your twig template directly:
In this case the media image URL is acquired from a node inside of a node tempalate node--node-type.html.twig, but this will work for other entities in other templates as well, e.g a paragraph in paragraph--paragraph-type.html.twig.
Comments
Be aware that this way you are calling the URL of the original image directly. Any imagestyles are ignored, so this might not always be want you want. You can use
ImageStyle::load([image_style])->buildUrl(file_uri)
to generate an image with an imagestyle.
Someone share the value module the other day, which lets you do this:
{{ _bundle.field_background_image.field_media_image.url }}.
or if you need to apply a image style:
{{ _bundle.field_background_image.field_media_image.uri|image_style('large') }}
Check it out: value
This is all easily accomplished with one line of Twig code by using the fantastic Bamboo Twig module.
Bamboo Twig's documentation is very good. Scroll down to the Images Styles section for details.
Awesome find, thanks!
I am going to mention it in the post.
There is an interesting issue describing the lack of collaboration of the maintainers of these two modules here.
Hey Pawel,
thanks for your article, so many people get stuck with images in Drupal 8!
As the Bamboo Twig author, I hope it will help in your Drupal 8 development!
Thanks for your contribution!
Thank you for the tips,
just wanna ask why not using:
{{ node.field_YOURMEDIA.entity.fileuri }}The media entity has fields and one of which is the image you want to refer to. So you are missing a reference to that field:
{{ node.field_YOURMEDIA.entity.field_image.etnity.fileuri }}
Then you need an actual absolute URL and you get it with the php function
file_url().I need to strip out the width and height values that my video is including.
When using images I would use a mytheme_preprocess_image to remove width and height values.
How would I do this for a video? (note: it's not a background video)
You can also use the Twig Field Value module (https://www.drupal.org/project/twig_field_value)
And then you can use this snippet:
{{ file_url(content.field_block_background_image|field_target_entity.field_media_image.entity.uri.value) }}Add new comment