Bien construire son fil d'ariane sur Drupal

Rédigé par Teddy Vermeulin le 14/11/2023

Dernière mise à jour le 05/03/2024

Construire un fil d'ariane efficace sur Drupal : Guide pratique avec intégration de Schema.org pour un meilleur référencement.

Le fil d'ariane, un enjeu de référencement

Schema.org, qu'est-ce que c'est ?

Schema.org est une initiative collaborative menée par les principaux moteurs de recherche, tels que Google, Microsoft et Yahoo, visant à créer et à promouvoir des schémas de données structurées sur Internet. 

Le but de Schema.org est de faciliter la compréhension du contenu des pages web par les moteurs de recherche, améliorant ainsi la qualité et la précision des résultats de recherche. 

En utilisant le vocabulaire de Schema.org pour marquer des informations sur des pages web (comme les personnes, les lieux, les événements, les produits, etc.), les développeurs peuvent aider les moteurs de recherche à mieux interpréter et afficher leurs contenus dans les résultats, tels que les extraits enrichis. 

Cela contribue non seulement à une meilleure visibilité des sites web dans les recherches, mais aussi à une expérience utilisateur améliorée, en offrant des informations pertinentes et structurées directement dans les résultats de recherche.

En savoir plus sur Schema.org

Intégration de Schema.org au fil d'ariane de Drupal

Pour intégrer Schema.org à votre fil d'ariane dans Drupal, il est nécessaire d'apporter des modifications au sein de votre thème. La première étape consiste à personnaliser le template qui gère l'affichage du fil d'ariane. Pour ce faire, créez un fichier nommé breadcrumb.html.twig dans le répertoire et placé le dans /web/themes/custom/my_theme/templates/navigation de votre thème.

{# /** * @file * Theme override for a breadcrumb trail. * * Available variables: * - breadcrumb: Breadcrumb trail items. */ #} {% if breadcrumb %} <nav class="breadcrumb mb-3 mb-md-4" role="navigation" aria-labelledby="system-breadcrumb" itemscope="itemscope" itemtype="https://schema.org/SiteNavigationElement"> <h2 id="system-breadcrumb" class="visually-hidden">{{ 'Breadcrumb'|t }}</h2> <ol itemscope itemtype="https://schema.org/BreadcrumbList"> {% for item in breadcrumb %} <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> {% if item.url %} <a itemprop="item" href="{{ item.url }}" {% if not loop.last %} title="{% if loop.index == 1 %}{{ "Back to home page"|t }}{% else %}{% trans %}Go to <em>{{ item.text }}</em>{% endtrans %}{% endif %}" {% endif %}> <span itemprop="name">{{ item.text }}</span> </a> <meta itemprop="position" content="{{ loop.index }}" /> {% else %} <span class="d-flex">{{ item.text }}</span> {% endif %} </li> {% endfor %} </ol> </nav> {% endif %}

Si Ariane avait su que son fil deviendrait un jour le guide préféré des navigateurs du web, elle aurait peut-être demandé des droits d'auteur à Thésée !