Ajouter un fil d’Ariane avec microdonnées BreadcrumbList sans extension SEO

Un client vend des pièces détachées pour électroménager, réparties sur cinq niveaux de catégories imbriquées. Sans fil d’Ariane visible, un visiteur qui arrive directement sur une fiche produit via une recherche n’a aucune idée d’où il se trouve dans le catalogue. Sans balisage BreadcrumbList, Google affiche l’URL brute et illisible dans les résultats de recherche plutôt que le chemin de navigation.

Le thème du client ne propose aucun fil d’Ariane, et l’ajout d’une extension complète pour ce seul besoin semblait disproportionné. Voici la recette utilisée : une fonction unique qui génère à la fois l’affichage HTML et les données structurées JSON-LD correspondantes, sans dépendance externe.

Construire le tableau des niveaux de navigation

La première étape consiste à construire un tableau ordonné représentant chaque niveau du fil d’Ariane, du plus général au plus spécifique. Sur une fiche produit imbriquée dans des catégories, WordPress fournit tout ce qu’il faut via les fonctions de hiérarchie de taxonomie :

function ma_recette_get_breadcrumb_items() {
    $items = array(
        array( 'label' => 'Accueil', 'url' => home_url( '/' ) ),
    );

    if ( is_singular( 'produit' ) ) {
        $terms = get_the_terms( get_the_ID(), 'categorie_produit' );
        if ( $terms && ! is_wp_error( $terms ) ) {
            $term = reset( $terms );
            $ancestors = array_reverse( get_ancestors( $term->term_id, 'categorie_produit' ) );
            foreach ( $ancestors as $ancestor_id ) {
                $ancestor = get_term( $ancestor_id, 'categorie_produit' );
                $items[] = array( 'label' => $ancestor->name, 'url' => get_term_link( $ancestor ) );
            }
            $items[] = array( 'label' => $term->name, 'url' => get_term_link( $term ) );
        }
        $items[] = array( 'label' => get_the_title(), 'url' => get_permalink() );
    }

    return $items;
}

Ce tableau unique sert ensuite de source à la fois pour l’affichage visuel et pour les données structurées, ce qui évite toute incohérence entre les deux : un problème fréquent quand le HTML et le JSON-LD sont maintenus séparément.

Afficher le fil d’Ariane en HTML

L’affichage HTML reste volontairement simple, avec une liste ordonnée :

function ma_recette_render_breadcrumb() {
    $items = ma_recette_get_breadcrumb_items();
    echo '<ol>';
    foreach ( $items as $i => $item ) {
        $is_last = ( $i === array_key_last( $items ) );
        echo '<li>';
        if ( $is_last ) {
            echo esc_html( $item['label'] );
        } else {
            echo '<a href="' . esc_url( $item['url'] ) . '">' . esc_html( $item['label'] ) . '</a>';
        }
        echo '</li>';
    }
    echo '</ol>';
}

Générer le JSON-LD BreadcrumbList

Le vocabulaire Schema.org attend un type BreadcrumbList contenant une liste de ListItem, chacun avec une position numérotée à partir de 1. C’est ce numéro de position, souvent oublié, qui permet à Google de reconstituer l’ordre correct :

function ma_recette_render_breadcrumb_jsonld() {
    $items = ma_recette_get_breadcrumb_items();
    $list  = array();

    foreach ( $items as $i => $item ) {
        $list[] = array(
            '@type'    => 'ListItem',
            'position' => $i + 1,
            'name'     => $item['label'],
            'item'     => $item['url'],
        );
    }

    $data = array(
        '@context'        => 'https://schema.org',
        '@type'           => 'BreadcrumbList',
        'itemListElement' => $list,
    );

    echo '<script type="application/ld+json">' . wp_json_encode( $data ) . '</script>';
}
add_action( 'wp_footer', 'ma_recette_render_breadcrumb_jsonld' );

Un piège fréquent : l’élément final ne doit pas avoir d’URL cliquable

Google recommande de ne pas inclure la propriété item sur le tout dernier élément de la liste, celui qui correspond à la page courante, puisqu’un lien vers soi-même n’a pas de sens. La documentation officielle tolère les deux approches, mais l’omission est la pratique la plus propre. On l’ajoute avec une simple condition sur le dernier index du tableau.

Variante pour les articles de blog

Pour un article de blog classé dans une seule catégorie, la même fonction peut être adaptée avec get_the_category() à la place de get_the_terms(), en gardant la même structure de tableau. Le reste du code, affichage et JSON-LD, ne change pas d’une ligne : c’est tout l’intérêt de séparer la collecte des données de leur rendu.

• Pages statiques imbriquées : utiliser get_post_ancestors() et remonter la hiérarchie des pages parentes.
• Woocommerce avec extension déjà présente : vérifier qu’aucun double balisage BreadcrumbList ne coexiste, Google peut ignorer les deux en cas de conflit.

Pour aller plus loin

Ce fil d’Ariane maison couvre l’essentiel sans ajouter de dépendance. Il reste à tester le résultat avec l’outil de test des résultats enrichis de Google avant mise en production, pour confirmer que chaque ListItem est bien reconnu et que la position de chaque niveau correspond à la hiérarchie réelle affichée à l’écran.