breadcrumb.html.twig

Le code ci-dessous affiche le fil d'ariane du site

{#
/**
 * @file
 * Theme override for a breadcrumb trail.
 *  Available variables:
 * - breadcrumb: Breadcrumb trail items.
 */
#}
{% if breadcrumb %}
    <nav role="dh-breadcrumb" aria-labelledby="system-breadcrumb">
        <h3 id="system-breadcrumb" class="visually-hidden">
            {{ 'Breadcrumb'|t }}
            {{  'Vous êtes ici :'|t  }}
        </h3>
            <ul>
                {% for item in breadcrumb %}
                    <li>                       
                        {% if item.url %}
                           <span> <a href="{{ item.url }}"> {{ item.text }}</a> </span>
                        {% else %}
                            <span>{{ item.text }}</span>
                        {% endif %}
                        <span>&nbsp;<img src="/themes/custom/dhv3/css/images/task-list.png"></span>
                    </li>             
                {% endfor %}
            </ul>    </nav>
{% endif %}

Ce code se déchiffre ainsi :

  • {% if breadcrumb %} : si un menu fil d'ariane est défini faire
  • {{ 'Breadcrumb'|t }} : écrire la traduction de 'Breadcrumb
  • {% for item in breadcrumb %} : pour chaque iten du menu faire

On observe également la mise en place de la balise CSS nav role="dh-breadcrumb" qui est responsable de la mise en forme du menu.

information complémentaire disponible en cliquant ici
  • {# afficher tous les blocs qui ont été assignés à la section "header" #} est un commentaire
  • {{ content }} signifie "rendre-évaluer-exprimer-produire" le résultat de l'expression "content"
  • {%  instruction   %} signifie "exécuter l'instruction
    • {%  if ... %} ....{%  else  %}  ... {%  endif  %}
    • {%  for  ... in ... %} {%  else  %}  ... {%  endfor %}
    • {%  block ....  %}  ... {%  endblock %}
  • plus d'information sur le moteur de template twig