Comment créer un sitemap visuel dans WordPress (La méthode facile)

Avez-vous déjà visité un site Web vaste et complexe et eu l'impression d'être perdu en essayant de trouver ce dont vous avez besoin ? Nous avons remarqué ce problème sur plusieurs sites majeurs comme des publications d'actualités ou des boutiques en ligne, même s'ils disposent déjà d'un menu de navigation pratique 😅

La bonne nouvelle, c'est que nous avons découvert une solution simple à ce problème : un plan de site visuel. C'est un guide convivial qui aide les visiteurs à naviguer dans la structure d'un site.

Dans cet article, nous vous montrerons comment créer un plan de site visuel dans WordPress avec un plugin facile à utiliser.

Mon site Web a-t-il vraiment besoin d'un plan de site visuel ?

Un plan de site est comme une feuille de route pour votre site Web, montrant toutes les pages importantes et comment elles sont connectées.

Si vous êtes familier avec les principes de SEO WordPress, alors vous connaissez probablement déjà le terme plans de site XML. Ceux-ci sont conçus pour les moteurs de recherche, les aidant à trouver et à comprendre votre contenu.

D'autre part, il existe également le plan de site HTML.

Dans cet article, nous allons nous concentrer sur les plans de site visuels, qui sont un type de plan de site HTML qui affiche la structure de votre site dans un format plus attrayant visuellement et facile à comprendre qu'un plan de site XML.

Si vous avez un site web qui s'adresse à différents types d'utilisateurs, un plan de site visuel peut aider à guider chaque visiteur vers la page ou l'article le plus pertinent pour ses intérêts. C'est comme avoir un guide amical qui montre à tout le monde où aller.

Les plans de site visuels peuvent également être excellents pour les sites éducatifs ou les cours en ligne. Ils peuvent montrer le parcours d'apprentissage et aider les étudiants à comprendre comment les différents sujets sont connectés.

Pour les boutiques en ligne avec de nombreuses catégories de produits, un plan de site visuel peut aider les acheteurs à comprendre votre gamme de produits en un coup d'œil et à trouver plus facilement les catégories qui les intéressent. Voici un excellent exemple que nous avons trouvé sur le site The Good Guys :

Dans cette optique, examinons comment créer un plan de site visuel dans WordPress.

Comment créer un plan de site visuel dans WordPress sans code (adapté aux débutants) 🗺️

Nous avions l'habitude de recommander le plugin Slick Sitemap pour créer des plans de site visuels, mais il n'a pas été mis à jour depuis longtemps. Et lorsque nous l'avons testé récemment, nous avons constaté qu'il ne fonctionnait plus aussi bien qu'avant.

Nous avons également essayé d'utiliser Gutenberg et du CSS personnalisé pour créer un sitemap. Cela a fonctionné au début, mais à mesure que nous ajoutions plus de pages à notre site, le sitemap a commencé à paraître étrange car le CSS ne pouvait pas suivre les changements.

Chez WPBeginner, nous aimons trouver des solutions faciles qui vous font gagner du temps et ne compliquent pas les choses. Et heureusement, nous avons trouvé un excellent plugin de remplacement appelé Simple Sitemap qui fait bien le travail.

Pour commencer, vous devrez installer et activer le plugin WordPress sur votre site Web. Une fois cela fait, vous pouvez créer un nouvel article ou une nouvelle page pour votre sitemap. Ou, vous pouvez en ouvrir un existant en utilisant l'éditeur de blocs Gutenberg.

Dans notre cas, nous avons décidé de créer une nouvelle page appelée « Sitemap ».

Avec l'éditeur de blocs ouvert, cliquez sur le bouton « + » n'importe où sur la page et sélectionnez le bloc « Simple Sitemap ».

Par défaut, le plugin crée un sitemap de vos pages et de leurs sous-pages, mais pas de vos articles.

Si vous souhaitez ajouter des articles au sitemap, rendez-vous dans les « Paramètres généraux » de votre onglet « Bloc ». Tapez ensuite « Article » dans le champ « Sélectionner les types d’articles à afficher ».

Une fois que vous aurez fait cela, vous verrez tous vos articles s’afficher sous la section des pages sur le sitemap.

Ensuite, personnalisons l’ordre dans lequel les pages et les articles sont listés. Vous pouvez choisir entre le titre, la date, l’ID, l’auteur, le nom, la date de modification, l’ordre du menu, l’ordre aléatoire ou le nombre de commentaires. Vous pouvez également choisir entre l’ordre « Ascendant » ou « Descendant ».

En faisant défiler vers le bas, vous pouvez choisir de :

• Afficher l’étiquette du type d’article pour différencier clairement les pages et les articles dans le sitemap.
• Afficher les extraits des articles et des pages. Nous avons décidé de désactiver cette option car elle pourrait allonger le sitemap.
• Activer les liens du sitemap. Si vous désactivez cette option, les utilisateurs ne pourront pas cliquer sur les liens du sitemap.
• Faire en sorte que chaque lien s’ouvre dans un nouvel onglet à chaque clic, afin que les utilisateurs ne quittent pas la page du sitemap.

Le réglage que vous choisirez dépendra de vos préférences et des besoins de votre site web, alors assurez-vous de bien réfléchir à ces options. De plus, vous pouvez toujours activer ou désactiver ces réglages si vous changez d’avis.

Sous cette section se trouve « Étiquettes des types d’articles ». Ici, vous pouvez remplacer l’étiquette par défaut du type d’article par un autre texte.

Dans notre exemple, nous avons décidé de remplacer l’étiquette « Pages » par « Explorez nos pages » comme appel à l’action.

Enfin, vous pouvez ouvrir les « Paramètres des onglets ».

C’est ici que vous pouvez activer les onglets pour afficher les liens de votre sitemap. Par défaut, les liens de votre sitemap seront divisés en fonction de leur type d’article. Cela peut être une excellente option si vous ne voulez pas que votre page de sitemap soit trop longue.

Une fois que vous êtes satisfait de l’apparence de la page du sitemap, vous pouvez continuer à personnaliser la page à votre guise. Si vous avez besoin d’aide, voici quelques guides pour vous aider à démarrer :

• Comment modifier un site Web WordPress (Guide ultime)
• Comment ajouter des polices personnalisées dans WordPress
• Comment ajouter une barre de défilement personnalisée à n'importe quel élément dans WordPress (si le bloc de sitemap est un peu long)

Lorsque vous êtes prêt, cliquez simplement sur Enregistrer, Mettre à jour ou Publier.

Assurez-vous de voir votre nouvelle page sur mobile, sur ordinateur et sur tablette pour voir si elle rend bien sur tous les appareils ou non.

Voici à quoi ressemble notre sitemap visuel :

Conseils bonus pour améliorer la navigation de votre site web

Vous voulez rendre votre site web encore plus convivial ? Consultez ces guides ci-dessous :

• Comment ajouter un menu plein écran réactif dans WordPress – Apprenez à créer un menu qui s'affiche parfaitement sur tous les appareils.
• Comment afficher des liens de navigation fil d'Ariane dans WordPress – Aidez les visiteurs à comprendre où ils se trouvent sur votre site.
• Comment ajouter la navigation au clavier avec les touches fléchées dans WordPress – Rendez votre site plus accessible aux utilisateurs du clavier.
• Comment créer un annuaire du personnel dans WordPress (avec profils d'employés) – Organisez efficacement les informations de votre équipe.
• Astuces pour la barre latérale WordPress pour obtenir des résultats maximums – Optimisez votre barre latérale pour une meilleure navigation et un meilleur engagement.

Nous espérons que cet article vous a aidé à apprendre comment créer un sitemap visuel dans WordPress. Vous voudrez peut-être aussi consulter notre sélection d'experts des meilleurs constructeurs de pages WordPress par glisser-déposer et notre guide ultime sur les éléments de conception les plus efficaces pour un site WordPress.

Si cet article vous a plu, abonnez-vous à notre chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.