web-dev-qa-db-fra.com

Ajout de données structurées JSON à WordPress

J'aimerais ajouter des données structurées à la suite de recommandations de Google . En suivant les instructions sur leur site, il est indiqué:

Le balisage est placé à l'intérieur d'une balise de script dans l'en-tête de la page HTML. Le balisage ne doit pas nécessairement être entrelacé avec le texte visible par l'utilisateur, ce qui facilite l'expression des éléments de données imbriqués, tels que le pays d'un adresse postale d'un lieu de musique d'un événement. En outre, Google peut lire les données JSON-LD lorsqu'elles sont injectées de manière dynamique dans le contenu de la page, par exemple avec du code JavaScript ou des widgets intégrés dans votre système de gestion de contenu.

Il dit qu'il devrait être ajouté à l'intérieur d'une balise de script dans l'en-tête de la page HTML, mais je me demandais s'il était également possible de l'ajouter via un fichier JSON inclus dans le fichier header.php (chargé dans fucntions.php). Si c'était possible, comment ajouteriez-vous breadscrumb SD?

Si les problèmes ci-dessus posent problème ou ne vous conviennent pas, quel est le meilleur moyen recommandé d'ajouter des données structurées à un site WordPress? Cela ne nécessite pas de plug-in.

jsongooglehtml
1
Edgar Quintero

Si vous créez le thème vous-même, vous pouvez toujours utiliser le balisage Schema Microata directement dans le thème lui-même.

Comme nous pouvons le voir dans l'exemple ci-dessous, l'ajout d'attributs supplémentaires à votre code HTML peut le rendre compatible avec le schéma. Dans ce cas, nous utilisons itemscope, itemtype et itemprop:

Extrait de http://schema.org/docs/gs.html#microdata_how

<div itemscope itemtype ="http://schema.org/Movie">
  <h1 itemprop="name">Avatar</h1>
  <div itemprop="director" itemscope itemtype="http://schema.org/Person">
  Director: <span itemprop="name">James Cameron</span> (born <span itemprop="birthDate">August 16, 1954</span>)
  </div>
  <span itemprop="genre">Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a>
</div>

Toutefois, si vous souhaitez utiliser le balisage JSON-LD, vous pouvez envisager de générer le fichier JSON-LD à l'aide d'une bibliothèque PHP JSON-LD } et d'injecter le code dans votre en-tête en attachant à la fonction wp_head:

Écrasés à partir de exemple GitHub PHP-JSON-LD : 

<?php

// Describe your Thing to be marked up as an array
$doc = (object) array(
    "http://schema.org/name" => "Manu Sporny",
    "http://schema.org/url" => (object) array("@id" => "http://manu.sporny.org/"),
    "http://schema.org/image" => (object) array("@id" => "http://manu.sporny.org/images/manu.png")
);

// Describe it's schema context as well
$context = (object)array(
  "name" => "http://schema.org/name",
  "homepage" => (object)array("@id" => "http://schema.org/url", "@type" => "@id"),
  "image" => (object)array("@id" => "http://schema.org/image", "@type" => "@id")
);

function wp_json_ld($doc, $context) {
    require_once('/path/to/library');

    // Pass it through this magical function
    $compacted = jsonld_compact($doc, $context);

    echo '<script type="application/ld+json">';
    echo json_encode($compacted, JSON_PRETTY_PRINT | JSON_UNESCAPED_SLASHES);
    echo '</script>';
}

/* Output:
<script type="application/ld+json">
{
  "@context": {...},
  "image": "http://manu.sporny.org/images/manu.png",
  "homepage": "http://manu.sporny.org/",
  "name": "Manu Sporny"
}
</script>
*/

// Add it to wp_head
add_action('wp_head', 'wp_json_ld');
3
FaCE