Comment ajouter facilement la navigation par fil d'Ariane dans WordPress

Vous cherchez un moyen simple d'ajouter une navigation par fil d'Ariane à votre site ?

L'ajout d'une navigation par fil d'Ariane présente des avantages en termes de SEO et d'expérience utilisateur.

Dans ce tutoriel, vous apprendrez comment ajouter une navigation par fil d'Ariane et quelques options pour personnaliser vos fils d'Ariane.

Qu'est-ce que la navigation par fil d'Ariane ?

Les fils d'Ariane sont de minuscules liens qui montrent aux utilisateurs le chemin qu'ils ont parcouru pour arriver à la page actuelle.

Ces liens sont aussi appelés un fil d'Ariane. 

Le terme vient du conte de fées Hansel et Gretel. Hansel laisse une piste de miettes de pain alors que lui et sa sœur entrent dans les bois. Il espère utiliser ces miettes pour retrouver son chemin vers la maison. 

Avantages des fils d'Ariane 

Les fils d'Ariane aident les moteurs de recherche à comprendre le sujet de votre page et la hiérarchie de votre site.

Ces fils d'Ariane peuvent aider votre page à se classer pour ses mots-clés cibles ou connexes.

Et comme les fils d'Ariane sont des liens internes, ils peuvent également aider les moteurs de recherche à explorer votre site. 

Schéma de balisage

Il existe également un avantage SEO à ajouter le fil d'Ariane schema markup à vos pages Web. Ce type de code HTML aide Google à mieux comprendre votre page. 

Les plugins SEO WordPress, comme All in One SEO (AIOSEO), ajouteront automatiquement ce code pour vous.

Expérience utilisateur améliorée

Les fils d'Ariane aident également les utilisateurs à naviguer sur un site sans utiliser le bouton retour du navigateur. Pour cette raison, les fils d'Ariane peuvent offrir une meilleure expérience utilisateur, réduire les taux de rebond et augmenter l'engagement.

Les sites complexes, y compris les magasins de commerce électronique avec des hiérarchies imbriquées, bénéficient grandement de la navigation par fil d'Ariane.

Dans ce tutoriel, nous vous montrerons comment ajouter des fils d'Ariane, les afficher et les personnaliser.

Nous utiliserons le plugin All in One SEO (AIOSEO).

Étape 1 : Télécharger et installer All in One SEO (AIOSEO)

Tout d'abord, téléchargez et installez All in One SEO (AIOSEO). 

Ce plugin comprend un générateur de fils d'Ariane. Il contient également tout ce dont vous avez besoin pour le SEO. Et il est convivial pour les débutants.

All in One SEO (AIOSEO) est un plugin établi avec des milliers d'avis 5 étoiles sur WordPress.org. Actuellement, plus de 3 millions de propriétaires de sites utilisent le plugin. 

Étape 2 : Activer les fils d'Ariane

Après avoir installé le plugin, allez dans AIOSEO » Paramètres généraux » Fils d'Ariane. 

Activez le bouton Activer les fil d'Ariane.

En dessous, vous verrez 4 options pour ajouter des fil d'Ariane à votre site.

Étape 3 : Choisir une option d'affichage

Voici les 4 options

• Bloc Gutenberg ou code court : Utilisez-les pour ajouter des fil d'Ariane à des pages individuelles. 
• Widget : Utilisez-le pour ajouter des fil d'Ariane à la barre latérale ou au pied de page de vos articles de blog.
• Code PHP : Utilisez-le pour ajouter instantanément des fil d'Ariane sur l'ensemble du site (sur toutes les pages).

Toutes ces méthodes sont faciles à utiliser. Passons-les en revue étape par étape.

Méthode 1 : Bloc Gutenberg

Comme vous le savez peut-être, WordPress est livré avec l'éditeur Gutenberg, qui utilise des blocs cliquables pour ajouter des éléments à une page. 

Ces éléments peuvent être un paragraphe, une liste à puces, une image ou un tableau.

All in One SEO vous fournit des blocs Gutenberg spéciaux, y compris le bloc AIOSEO – Fil d'Ariane.

Pour utiliser ce bloc, ouvrez une page et placez votre curseur là où vous souhaitez que les fil d'Ariane soient ajoutés. 

• Cliquez sur le signe « + » noir pour ajouter un nouveau bloc. 
• Dans la fenêtre contextuelle, recherchez « fil d'Ariane », et le bloc AIOSEO – Fil d'Ariane apparaîtra.
• Cliquez dessus pour ajouter des fil d'Ariane à votre page.
  

Méthode 2 : Shortcode

Il existe également un code court AIOSEO unique pour ajouter des fil d'Ariane.

Les codes courts WordPress sont de petits morceaux de texte que vous copiez et collez sur une page pour ajouter un élément, comme une table des matières. 

Comme les blocs Gutenberg, les codes courts sont rapides et faciles à utiliser.

Retournez à AIOSEO » Paramètres généraux » Fil d'Ariane pour obtenir le code court du fil d'Ariane.

1. Cliquez sur l'icône Code court.
2. Et copiez le code court du fil d'Ariane AIOSEO en dessous.

Maintenant, naviguez vers une page de votre site à laquelle vous souhaitez ajouter des fil d'Ariane.

Collez ensuite le code court dans votre article.

Lorsque vous prévisualisez votre page Web, vous pouvez voir que les fil d'Ariane ont été ajoutés.

Méthode 3 : Widget

Les widgets WordPress vous permettent d'ajouter des fonctionnalités à des parties permanentes de votre site, comme les barres latérales et les pieds de page. 

Les widgets incluent des calendriers, des boîtes de recherche et des archives.

Pour ajouter des fil d'Ariane à votre site en utilisant l'option de widget, allez dans Apparence » Widgets. 

(Si votre thème prend en charge les zones de widgets, vous la verrez dans le menu.)

Cela ouvrira une nouvelle fenêtre. Vous verrez une réplication déroulante de votre barre latérale sur le côté droit. 

Maintenant, cliquez sur l’icône « + » à côté du mot Widgets.

Cela ouvrira une boîte de recherche. Commencez à taper « breadcrumbs », et le widget AIOSEO breadcrumbs apparaîtra. 

Faites glisser le widget là où vous souhaitez qu’il apparaisse dans la barre latérale. 

Dans notre exemple, nous le ferons glisser dans la zone du pied de page. 

Maintenant, nos fil d’Ariane s’afficheront dans le pied de page de la barre latérale.

Bien sûr, vous pouvez avoir des fil d’Ariane dans votre barre latérale et en haut de vos pages.

Méthode 4 : Code PHP

Vous pouvez facilement ajouter des fil d’Ariane sur tout le site à l’aide d’un extrait de code PHP.

Vous copierez et collerez cet extrait comme vous le feriez avec du texte normal. 

L’avantage d’utiliser cette option est qu’elle ajoutera automatiquement des fil d’Ariane à toutes vos pages, et vous n’aurez jamais besoin de répéter cette action. 

Voici les étapes :

1. Copiez l’extrait de code.
2. Ouvrez l’éditeur de thème.
3. Cliquez sur header.php.
4. Collez l’extrait de code.

Passons en revue ces étapes.

1. Copiez l’extrait de code

Sur la page AIOSEO Breadcrumbs, 

• Cliquez sur Code PHP. Cela fera apparaître une petite ligne de code. 
• Cliquez sur la petite icône de copie à droite de l’extrait de code. 

Maintenant que vous avez copié cette ligne de code, vous allez la coller dans votre thème. 

2. Ouvrez l’éditeur de thème.

• Dans la navigation de gauche de WordPress, allez dans Apparence » Éditeur de fichiers du thème. 

Une nouvelle fenêtre s’ouvrira comme celle-ci :

3. Cliquez sur header.php

• Dans la colonne de droite (Fichiers du thème), faites défiler pour trouver header.php et cliquez dessus.

Cela fera apparaître une nouvelle fenêtre de code à gauche.

4. Collez le code.

• Recherchez la balise </head>. 
• En dessous, collez l'extrait de code PHP.
• Cliquez ensuite sur Mettre à jour le fichier pour enregistrer vos modifications.

Voici un gros plan de la balise </head> et de l'extrait de code PHP pour le fil d'Ariane.

Après avoir cliqué sur Mettre à jour le fichier, toutes vos pages Web auront des fils d'Ariane ajoutés. 

Et les nouveaux articles ou pages en auront également.

Attention : Avant la balise </head>, il y a une balise <head> (sans la barre oblique). L'extrait de code PHP doit être placé après la balise </head>.

Maintenant que vous savez comment ajouter la navigation par fil d'Ariane sur votre site WordPress, nous allons vous montrer comment personnaliser son apparence.

Paramètres des fils d'Ariane

La modification de vos paramètres de fil d'Ariane modifiera l'apparence de vos fils d'Ariane.

Ces paramètres incluent des options pour :

• Inclure ou omettre votre page d'accueil.
• Utiliser différents styles de séparateur.
• Inclure ou omettre la page actuelle (titre de la page) sur laquelle l'utilisateur se trouve.

Tout d'abord, vous verrez l'aperçu Preview en haut de la zone des paramètres du fil d'Ariane Breadcrumb Settings.

Au fur et à mesure que vous ajustez les paramètres, cet aperçu changera.

Sous l'aperçu, vous pouvez expérimenter différents styles de séparateur. 

Et vous pouvez désactiver le lien de la page d'accueil ou lui donner une étiquette différente. (« Accueil » est l'étiquette par défaut.)

Faites défiler un peu vers le bas.

Ici, vous avez 2 options de personnalisation supplémentaires. 

• Préfixe du fil d'Ariane : Si vous souhaitez qu'un texte s'affiche au début de votre fil d'Ariane, saisissez-le ici.
• Afficher l'accueil du blog : Désactivez cette option si vous ne souhaitez pas que le nom de votre blog apparaisse dans le fil d'Ariane.

En savoir plus sur les paramètres du fil d'Ariane.

Utilisation des modèles de fils d'Ariane Pro

Si vous utilisez la version Pro d'All in One SEO (AIOSEO), vous verrez les options de modèle de fil d'Ariane en bas de AIOSEO » Paramètres généraux » Fils d'Ariane.

Les modèles vous permettent de modifier l'apparence des fils d'Ariane. Vous pouvez choisir différentes options pour différents types d'articles.

En savoir plus sur les modèles de fil d'Ariane.

Types de navigation par fil d'Ariane

En plus des fils d'Ariane basés sur la hiérarchie abordés ci-dessus, il existe 2 autres types de navigation par fil d'Ariane. 

Fils d'Ariane basés sur l'historique (Fils d'Ariane basés sur le chemin)

Ce type de navigation affiche les pages que vous avez visitées sur un site. 

Cela peut devenir difficile à gérer lorsque les utilisateurs visitent de nombreuses pages.

Migrations basées sur les attributs

Certains sites de commerce électronique incluent des attributs de produit, tels que la couleur, la finition ou la taille, dans leurs fils de migration. 

Ceux-ci peuvent être combinés avec des migrations basées sur la hiérarchie.

Bonnes pratiques

Google recommande que vos migrations correspondent à la hiérarchie de votre site. 

Cela dit, elles ne doivent pas reproduire ni remplacer vos éléments de navigation principaux. 

Résumé

Les migrations peuvent améliorer la convivialité de votre site Web et aider vos pages à mieux se classer dans les résultats de recherche Google. 

Les sites de commerce électronique avec de nombreuses pages de produits et les sites riches en informations bénéficieront considérablement de la navigation par migrations. Mais tout propriétaire de site peut l'ajouter. 

Et ensuite ?

Maintenant que vous avez appris à ajouter des migrations, quelle est la prochaine étape ?

Apprendre à ajouter un sitemap HTML à votre site WordPress est facile. Et explorez nos projets de référencement à faire soi-même pour débutants.

Si vous avez trouvé cet article utile, veuillez vous abonner à notre chaîne YouTube. Vous y trouverez de nombreux autres tutoriels utiles. Vous pouvez également nous suivre sur X (Twitter), LinkedIn ou Facebook pour rester informé.

Divulgation : Notre contenu est financé par nos lecteurs. Cela signifie que si vous cliquez sur certains de nos liens, nous pouvons gagner une commission. Nous ne recommandons que les produits qui, selon nous, apporteront de la valeur à nos lecteurs.