Générer des données structurées avec JavaScript

Les sites web modernes utilisent JavaScript pour afficher beaucoup de contenu dynamique. Il y a quelques points à surveiller lors de l’utilisation de JavaScript pour générer des données structurées sur vos sites web, et ce guide couvre les meilleures pratiques et les stratégies de mise en œuvre. Si vous débutez avec les données structurées, vous pouvez en savoir plus sur
le fonctionnement des données structurées.

Il existe différentes manières de générer des données structurées avec JavaScript, mais les plus courantes sont :

• Google Tag Manager
• JavaScript personnalisé

Utilisez Google Tag Manager pour générer du JSON-LD dynamiquement

Google Tag Manager est une plateforme qui vous permet de gérer les balises sur votre site web sans modifier le code. Pour générer des données structurées avec Google Tag Manager, suivez ces étapes :

1. Configurez et installez Google Tag Manager sur votre site.
2. Ajoutez une nouvelle HTML personnalisé balise au conteneur.
3. Collez un bloc de données structurées pris en charge dans le contenu de la balise.
4. Installez le conteneur comme indiqué dans la section Installer Google Tag Manager du menu d’administration de votre conteneur.
5. Pour ajouter la balise à votre site web, publiez votre conteneur dans l’interface de Google Tag Manager.
6. Testez votre mise en œuvre.

Utilisation de variables dans Google Tag Manager

Google Tag Manager (GTM) prend en charge les variables
pour utiliser les informations de la page dans le cadre de vos données structurées. Utilisez des variables pour extraire les données structurées de la page au lieu de dupliquer les informations dans GTM. La duplication des informations dans GTM augmente le risque de décalage entre le contenu de la page et les données structurées insérées à l’aide de GTM.

Par exemple, vous pouvez créer dynamiquement un Recette bloc JSON-LD
qui utilise le titre de la page comme nom de la recette en créant la variable personnalisée suivante nommée:

recipe_name Vous pouvez ensuite utiliser {{recipe_name}}

dans le HTML de votre balise personnalisée.

Nous vous recommandons de créer des variables pour collecter toutes les informations nécessaires à partir de la page en utilisant des variables.

dans GTM.

Générer des données structurées avec du JavaScript personnalisé
Une autre façon de générer des données structurées consiste à utiliser JavaScript pour générer toutes vos données structurées ou pour ajouter plus d’informations aux données structurées rendues côté serveur. Dans les deux cas, Google Search peut comprendre et traiter les données structurées disponibles dans le DOM lorsqu’il rend la page. Pour en savoir plus sur la façon dont Google Search traite JavaScript, consultez le.

guide des bases de JavaScript

1. Voici un exemple de données structurées générées par JavaScript : Trouvez le type de
2. données structurées
3. qui vous intéresse..

Modifiez le HTML de votre site web pour inclure un extrait JavaScript comme dans l’exemple suivant (consultez la documentation de votre CMS ou de votre fournisseur d’hébergement, ou demandez à vos développeurs).

Testez votre mise en œuvre avec le test des résultats enrichis Utilisation du rendu côté serveurSi vous utilisez le rendu côté serveur
, vous pouvez également inclure les données structurées dans la sortie rendue. Consultez la documentation de votre framework pour savoir comment générer le JSON-LD pour

le type de données structurées

qui vous intéresse.

1. Testez votre mise en œuvre Pour vous assurer que Google Search peut explorer et indexer vos données structurées, testez votre mise en œuvre :.
2. Ouvrez le
   
3. Saisissez l’URL que vous souhaitez tester. Nous vous recommandons d’utiliser l’entrée URL plutôt que l’entrée de code, car il existe des limitations JavaScript lors de l’utilisation de l’entrée de code (par exemple, les restrictions CORS)..

   Cliquez surTester l’URL Succès: Si vous avez tout fait correctement et que votre
   type de données structurées est pris en charge par l’outil

   , vous verrez le message “La page est éligible aux résultats enrichis”.Si vous testez un type de données structurées qui n’est pas pris en charge par le test des résultats enrichis, vérifiez le HTML rendu. Si le HTML rendu contient les données structurées, Google Search pourra les traiter. Réessayez : Si vous voyez des erreurs ou des avertissements, il s’agit très probablement d’une erreur de syntaxe ou d’une propriété manquante. Lisez la
   documentation.