Supposons que nous ayons une image stockée à cet endroit:

/themes/custom/MonTheme/images/ma_photo.jpg

<img alt="Ma Photo" src="{{path('<front>') ~ directory }}/images/ma_photo.jpg" />

Utiliser la variable directory dans le template twig :

<img alt="Ma Photo" src="{{ directory }}/images/ma_photo.jpg" />

Mais ça ne fonctionne pas !

L'astuce ci-dessous nous donne un chemin relatif qui fonctionne quand on est à la racine du site (sur la page d'accueil).

Mais dès qu'on va sur une autre page, le chemin qui était relatif à la racine ne fonctionne plus à partir de la page actuelle.

Il existe une variable base_path mais elle n'est pas disponible dans tous les templates, alors nous allons la rendre disponible en créant un fichier MonTheme.theme situé à la racine du thème.

Exemple /themes/custom/MonTheme/MonTheme.theme :

<?php
function MonTheme_preprocess(array &$variables, $hook) {
    $variables['base_path'] = base_path();
}

Normalement maintenant le chemin indiqué dans la variable base_path devrait être correct sur toutes les pages.

<img alt="Ma Photo" src="{{ base_path ~ directory }}/images/ma_photo.jpg">

Sources :

• http://data.agaric.com/how-get-base-path-your-drupal-8-site-twig-template