Aller au contenu principal
Menu
Offcanvas

Obtenir l'URL d'une image dans un template twig paragraph Drupal

Parfois, il peut être utile d'accéder à l'URI brut ou à l'URL du fichier d'une image envoyée avec un champ de référence media dans Drupal 8.

Pour répondre à un besoin spécifique du template, vous pouvez avoir besoin de l'URL du fichier image plutôt que de vouloir que Drupal rende l'image et la structure  HTML (markup) qui enveloppe l'image. 

Dans un template twig, utilisez simplement la syntaxe suivante, en remplaçant le nom de champ par le nom machine (machine name) de ce champ Media personnalisé :

{% if paragraph.field_custom_image is not empty %}
  {{ file_url(paragraph.field_custom_image.entity.field_media_image.entity.fileuri) }}
{% endif %}

Ce code fonctionne très bien pour les champs Media. Mais les champs Média fonctionnent différemment des champs natifs Image dans Drupal 8. Si votre champ utilise un type de champ Image, plutôt qu'un champ Média (référence d'entité), vous devrez alors utiliser la syntaxe suivante à la place :

{{ file_url(paragraph.field_custom_image.entity.uri.value) }}

Si vous avez besoin d'accéder à la valeur alt de l'image :

{{ content.field_custom_image['#items'].alt }}

La valeur du titre pour le champ :

{{ content.field_custom_image['#items'].title }}

Voilà par exemple un exemple concret ou l'on peut avoir besoin de l'url. Le contributeur envoie une image dans le BO pour son contenu. En front, l'image s'affiche en background avec du CSS in-line :

<div class="icn" style="background-image: url('{{ file_url(paragraph.field_icone.entity.uri.value) }}');"></div>

 

Autres ressources utiles

Ajouter un commentaire

Articles similaires

Comment supprimer les changements locaux avec git que l'on n'a pas commit ?

LIRE LA SUITE