Aller au contenu Accéder à la navigation

Comment utiliser les schémas dans votre site WordPress avec SEOPress PRO #2

Voici le deuxième article de notre série de tutoriels consacrée aux données structurées. Nous vous invitons à lire (ou relire) notre premier article introductif sur les schémas si vous ne l’avez pas déjà fait. Aujourd’hui, nous allons apprendre à mettre en place concrètement une donnée structurée sur votre site.

Téléchargez notre Ebook gratuit « Maîtriser les types de données structurées de Google (schémas) »

Prérequis

Assurez-vous d’utiliser les dernières versions de SEOPress Free et PRO avant de commencer.

La version PRO de SEOPress est nécessaire pour mettre en place les données structurées sur votre site.

De plus, votre page ne doit pas être bloquée par le fichier robots.txt ou avoir une balise meta robots définie sur noindex afin que Google puisse indexer et détecter vos données structurées correctement.

Vous devez également activer la fonctionnalité Types de données structurées depuis SEO > PRO > Types de données structurées via la case à cocher (façon iOS) puis en activant l’option Activez la metaboxe Types de Structures de Données pour vos articles, pages et types de contenu.

Et mettre en ligne une image pour le logo de l’éditeur (Publisher Logo). Cette information sera utilisée automatiquement dans de nombreux schémas. Respectez bien les consignes situées sous le champ pour que votre logo soit valide aux yeux de Google.

Il est également nécessaire de renseigner au maximum les champs du Knowledge Graph situés dans SEO > Réseaux sociaux > Knowledge Graph. Depuis SEOPress PRO 10.4, plusieurs schémas y sont reliés (voir Comment SEOPress relie vos schémas entre eux plus bas).

N’oubliez pas d’enregistrer les modifications.

Schémas automatiques vs schémas manuels : quelle différence ?

Il existe 2 types de schémas dans SEOPress :

  • manuel : ce schéma s’applique uniquement via la metaboxe Types de données structurées au contenu en cours d’édition (article, page ou type de publication). Il est donc individuel.
  • automatique : ce schéma est créé depuis la page SEO > Schémas > Ajouter un schéma. Il est global car il s’applique à l’ensemble d’un type de publication défini. Une fois ajouté à la liste des schémas, il apparaît également dans l’onglet Automatique de la metaboxe Types de données structurées lors de l’édition d’un contenu, avec plus ou moins de champs à remplir en fonction de ce que vous avez défini lors de la création du schéma (cf. cas pratique n° 3 de cet article).

Cas pratique n° 1 : ajoutez un schéma pour votre établissement local (Local Business)

Commençons par un cas très classique. Vous possédez un restaurant et un site web assure sa promotion en ligne avec les différents menus et plats que vous servez.

Vous pouvez lui ajouter un schéma Fiche d’établissement local (local business) pour que, lorsque les internautes effectueront une recherche locale sur le nom de votre restaurant, apparaisse une carte Knowledge Graph (cf. capture d’écran ci-contre) mettant en avant des informations essentielles comme les horaires d’ouverture, vos coordonnées, des photos, avis utilisateurs, etc.

Si votre site ne possède qu’un établissement physique, vous pouvez mettre en place ce schéma depuis SEO, PRO, Local Business.

Sélectionnez un type de business, ici, Restaurant. Si celui recherché n’y figure pas, optez pour Local Business.

Remplissez l’ensemble des champs le plus précisément possible.

Respectez bien les consignes décrites par les différents placeholders des champs. Exemple, le numéro de téléphone doit obligatoirement être saisi au format international.

Tous les champs sont requis par Google.

Enregistrez les modifications et videz votre cache si vous en avez un.

SEOPress - Schema Local Business
SEOPress – Schema Local Business

À propos des horaires d’ouverture

Si votre établissement est ouvert 24 h/24, indiquez 0:00 et 23:59 pour chaque jour de la semaine.
Si votre établissement possède plusieurs plages horaires dans une seule journée, alors désactivez la fonctionnalité Local Business à l’aide de la case à cocher verte (façon iOS), et utilisez un schéma manuel qui offre davantage de flexibilité sur ce point.

Pour saisir un schéma manuel Fiche d’établissement local (local business) pour votre site, éditez la page d’accueil dans WordPress et allez dans la metaboxe Types de données structurées, sélectionnez Local Business et remplissez les champs. Depuis la section Horaires d’ouverture, saisissez vos heures d’ouverture et de fermeture pour à la fois le matin et l’après-midi.

Et si j’ai plusieurs établissements ?

Mise à jour du 31/12/2020 : depuis la version 4.2 de SEOPress PRO, vous pouvez ajouter un nombre illimité de schémas manuels depuis l’édition d’un post, y compris plusieurs schémas Local Business.

Une solution consiste à créer une page de contenu par établissement puis d’ajouter sur chacune d’elles un schéma Local Business. Prenez soin de désactiver la fonctionnalité Local Business globale pour éviter des schémas en double.

Depuis SEOPress PRO 10.4, chaque schéma Local Business manuel reçoit son propre identifiant : les moteurs de recherche ne confondent plus deux établissements présentés sur une même page.

Cas pratique n° 2 : ajoutez un schéma FAQ sur votre page Foire Aux Questions

Les pages de type Foire Aux Questions (en abrégé FAQ) sont un excellent moyen d’augmenter votre conversion en répondant aux questions les plus fréquemment posées par vos visiteurs sans qu’ils aient à vous le demander par eux-mêmes. Avec le schéma FAQ, lorsque l’internaute pose une question sur votre activité ou un sujet en rapport avec votre business, une liste de questions / réponses peut apparaître directement dans les résultats de recherche. Il est même possible d’ajouter des liens vers votre site dans les réponses.

Ce schéma est facile et rapide à mettre en place et Google l’ajoute généralement très rapidement. Il serait dommage de s’en priver.

Pour ajouter ce schéma à votre page FAQ, éditez la page en question, et depuis la metaboxe Types de données structurées, cliquez sur l’onglet Manuel.

Sélectionnez le type de données FAQ puis ajoutez vos différentes questions / réponses.

Enregistrez votre article et videz le cache.

Cas pratique n° 3 : ajoutez automatiquement un schéma Produit sur l’ensemble de vos produits avec WooCommerce

Maintenant que nous avons traité les schémas manuels, abordons la question des schémas automatiques (globaux). Si vous souhaitez mettre en place un schéma produit pour l’ensemble des fiches produits de votre site e-commerce, en fonction de la taille de votre catalogue, cela peut vous prendre une éternité. C’est là qu’interviennent les schémas automatiques.

Depuis la page SEO > Schémas, cliquez sur Ajouter un schéma.

Donnez-lui un titre, par exemple Produit, sélectionnez un schéma, « Produit », et indiquez sur quel type de publication il doit s’activer (là encore « Produits »).

Puis, pour chaque propriété, associez un par un chaque champ, soit à une variable préconfigurée (ex. : pour le nom du produit, indiquez Titre de l’article / Titre du produit), un champ personnalisé de votre choix, une saisie manuelle en dur globale, ou manuelle par article.

Dans le cas de la saisie manuelle par article, le champ apparaîtra automatiquement dans la metaboxe Types de données structurées, onglet Automatique lors de l’édition de votre produit (cf. capture ci-dessous) :

Le code du schéma, en JSON-LD, sera généré dynamiquement pour chacune de vos fiches produits et ajouté au code source de vos pages sans aucune intervention technique de votre part.

Pensez à vider votre cache après l’ajout d’un schéma automatique.

J’ai déjà un schéma Produit sur mes fiches produits ? D’où vient-il ?

WooCommerce ajoute automatiquement depuis la version 3 un schéma Produit en JSON-LD sur l’ensemble de vos fiches produits. L’inconvénient est qu’il est incomplet et génère donc des erreurs et alertes dans Google Search Console. Nous vous conseillons donc vivement de le désactiver au profit de celui généré par SEOPress. Pour ce faire, allez dans SEO > PRO > WooCommerce et cochez l’option Retirer les données structurées JSON-LD par défaut (WooCommerce 3+). Enregistrez les modifications et videz le cache.

Comment SEOPress relie vos schémas entre eux

Chaque schéma publié par SEOPress porte un identifiant (@id). Les moteurs de recherche s’en servent pour comprendre que deux schémas décrivent la même chose, par exemple que l’éditeur d’un article est l’organisation de votre Knowledge Graph, même lorsque ces schémas se trouvent dans des balises script distinctes.

Depuis SEOPress PRO 10.4 :

  • Le Local Business défini dans SEO > PRO > Local Business partage l’identifiant de l’organisation de votre Knowledge Graph : les deux décrivent la même entreprise.
  • L’éditeur (publisher) des schémas automatiques Article et Vidéo partage lui aussi cet identifiant. Il conserve son nom et votre logo d’éditeur.
  • Un schéma manuel Local Business ou Service reçoit son propre identifiant, construit à partir de l’URL de la page (#localbusiness, #service). Lorsqu’une page contient plusieurs schémas du même type, ils sont numérotés (-2, -3…) afin de ne jamais être fusionnés.
  • Le schéma du fil d’Ariane porte un identifiant sur toutes les pages, y compris les archives de catégories, les pages d’auteur, la page des articles et la page boutique, et chaque élément du fil est identifié par l’URL de sa page.
Le lien avec le Knowledge Graph n’est établi que si la fonctionnalité Réseaux sociaux est activée et si le Knowledge Graph décrit une organisation : dans SEO > Réseaux sociaux > Knowledge Graph, choisissez un type autre que Aucun ou Personne. L’éditeur des schémas Article et Vidéo n’est ajouté que si le nom de votre organisation est renseigné.

Publier les schémas WebSite et Knowledge Graph dans un seul @graph

Par défaut, chaque schéma est publié dans sa propre balise <script type="application/ld+json">. Depuis SEOPress 10.4, vous pouvez fusionner le schéma WebSite et le schéma Knowledge Graph (Organization ou Person) de votre page d’accueil en un seul bloc, à l’aide de @graph.

  1. Allez dans SEO > Avancé, onglet Avancé.
  2. Dans la section Données structurées, activez Sortie @graph unique : Fusionner les schémas WebSite et Knowledge Graph dans un seul @graph.
  3. Cliquez sur Enregistrer et videz votre cache.

L’option est désactivée par défaut. Une fois activée, les deux schémas sont publiés dans une seule balise <script id="seopress-schema-graph" type="application/ld+json">. Les moteurs de recherche lisent tous les blocs JSON-LD d’une page et résolvent les références de l’un à l’autre : cette option modifie donc la présentation de vos données structurées, pas leur signification. Activez-la si vous préférez un seul bloc dans votre code source.

Vos autres schémas, comme Local Business, le fil d’Ariane, les produits, le bloc FAQ et les schémas ajoutés à vos contenus, conservent leur propre balise script.

Pour les développeurs : les filtres et le @graph unique

Lorsque la sortie @graph unique est activée :

  • Les filtres qui modifient les données d’un schéma, comme seopress_schemas_website et seopress_get_json_data_organization, fonctionnent comme avant.
  • seopress_schemas_website_html reçoit la balise <script> complète, qui n’existe plus une fois les blocs fusionnés. Renvoyer une chaîne vide supprime toujours le schéma WebSite, mais toute autre modification est ignorée : ce filtre ne peut plus remplacer le balisage.
  • seopress_schemas_organization_html reçoit le contenu JSON. Renvoyer une chaîne vide supprime le Knowledge Graph ; renvoyer un JSON valide avec un @type remplace le nœud dans le graphe.
  • Pour modifier la sortie fusionnée, utilisez seopress_schemas_graph (le tableau des nœuds, avant l’affichage ; un tableau vide n’affiche rien) ou seopress_schemas_graph_html (la balise <script> complète, avec les nœuds en second argument).
  • seopress_schemas_graph_enabled active ou désactive la sortie @graph unique pour la requête en cours, quel que soit le réglage.
// Force the single @graph output, whatever the setting.
add_filter( 'seopress_schemas_graph_enabled', '__return_true' );

// Remove the WebSite node from the graph.
add_filter( 'seopress_schemas_graph', function( $nodes ) {
	return array_values( array_filter( $nodes, function( $node ) {
		return 'WebSite' !== $node['@type'];
	} ) );
} );

Schémas personnalisés : des variables sans guillemets

Dans un Schéma personnalisé automatique créé depuis SEO > Schémas, vous pouvez écrire une variable dynamique sans guillemets pour qu’elle produise un tableau, un objet ou un nombre, par exemple "workLocation": %%_cf_clinician_locations%%. Depuis SEOPress PRO 10.4, l’éditeur accepte cette syntaxe et ne signale plus le schéma comme un JSON non valide. Il affiche : JSON-LD valide (@type : …). Les variables sans guillemets doivent produire un JSON valide sur chaque page, par exemple [] lorsqu’elles n’ont pas de valeur.

Une variable sans guillemets qui ne produit rien laisse une propriété sans valeur, ce qui rend tout le schéma invalide sur la page concernée. Assurez-vous que la variable renvoie toujours un JSON valide, par exemple [] lorsque le champ est vide.

Testez vos schémas

De nombreux thèmes et extensions ajoutent des schémas automatiquement à vos pages. Inconvénients majeurs : schémas dupliqués, propriétés requises manquantes, propriétés dépréciées, etc.

Bonne nouvelle, deux outils gratuits permettent de tester le balisage de vos pages :

Lorsque vous éditez un contenu, cliquez sur Valider mon schéma sous vos schémas pour ouvrir le test de Google avec l’URL de ce contenu, ou sur Schema Markup Validator pour ouvrir le Schema Markup Validator de la même façon. Le contenu doit être publié : ces outils ne peuvent tester qu’une URL publique et en ligne. Depuis SEOPress PRO 10.4, le bouton Schema Markup Validator figure aussi dans l’onglet Manuel de la metaboxe Types de données structurées, à côté de Valider mon schéma.

Un type absent du test de Google ne signifie pas que votre balisage est absent : vérifiez-le avec le Schema Markup Validator.

Saisissez l’URL, lancez le test, patientez quelques secondes et le résultat s’affiche avec la liste des schémas détectés. Cliquez sur l’un d’entre eux pour afficher les détails et les éventuels avertissements et / ou erreurs.

Validez vos schémas via Google Search Console

La Google Search Console vous permet de savoir si Google a bien pris en compte et validé vos schémas. Depuis quelque temps, vous pouvez par exemple avoir des informations sur les schémas Produits, FAQ, Fil d’Ariane, Logo, etc. S’il y a des erreurs, elles seront visibles avec des aides pour déboguer. Une fois l’erreur corrigée, vous pouvez demander à Google de revalider la page. Cela peut prendre plusieurs jours, voire semaines. Heureusement, le processus de validation est affiché depuis votre Search Console, et des notifications par e-mail vous informent régulièrement de l’avancée de la validation.

Dans cette capture d’écran, Google a bien détecté et validé 290 schémas de type Fil d’Ariane. Une erreur a été trouvée sur une page, mais c’était un faux positif, le code était bien correct. Nous avons donc demandé à Google de revérifier la page. Comme le montre l’image, la colonne Validation indique bien que tout est OK (Passed). Ci-dessous, voilà à quoi ressemble le processus de validation avec les différentes étapes :

Conclusion

Testez autant que possible vos schémas. Vérifiez régulièrement votre Search Console (patientez plusieurs jours, voire semaines, avant de voir vos schémas apparaître dans GSC) et soyez à l’affût des erreurs / avertissements. Ne sur-schématisez pas vos pages.

Nous vous invitons à parcourir nos différents guides sur le sujet et à poster vos questions en commentaires.