Données structurées et TYPO3
Crée le : 28.02.2018
Liens
Les données structurées ont pris une place importante dans la mise en place d'un site internet. Celles-ci permettent aux robots d'indexation comme Google de comprendre la nature de l’élément décrit et de ses composantes.
Nous recevons aujourd'hui un nombre conséquent de demande d'entreprises qui souhaitent se démarquer des autres dans les résultats de recherche. Listing d'événements, de produits, d'actualités, de personnes, de films ou encore de recettes sont des exemples que l'ont peut dores et déjà décorer avec des données structurées.
Le fait d'ajouter ces données structurées aux éléments d'un site offre des avantages considérables en terme de référencement. Ceci modifie l'apparence dans les résultats de recherche. Google va présenter vos éléments de manière optimisée en fonction de leur nature.
Exemple pour des recettes
On peut voir premièrement les ingrédients de la recette, puis, la note donnée par les utilisateurs, le nombre d'avis ou encore le temps de préparation. Le résultat de recherche est donc bien mis en avant et nous donne des informations pertinantes sur ce que l'on cherche.
Proposition pour l'intégration à TYPO3
En parcourant le web à la recherche d'une librairie permettant d'ajouter facilement des données structurées, écrite en PHP et pouvant facilement s'intégrer à TYPO3, je suis tombé sur ceci : https://github.com/Torann/json-ld.
L'installation est simple, elle se réalise avec composer. On peut donc facilement l'inclure à une de nos extensions comme ceci dans le fichier composer.json :
{
...
"require": {
"torann/json-ld": "^0.0.11"
}
...
}
Ensuite, je créé un ViewHelper (c. f. le manuel TYPO3 pour la création de ViewHelper) qui me permet d'ajouter des données dans la balise head de mes pages comme ceci :
use JsonLd\Context;
use TYPO3\CMS\Core\Page\PageRenderer;
use TYPO3\CMS\Core\Utility\GeneralUtility;
use TYPO3\CMS\Fluid\Core\ViewHelper\AbstractViewHelper;
class FromTyposcriptViewHelper extends AbstractViewHelper
{
/**
* {@inheritdoc}
*/
public function initializeArguments()
{
$this->registerArgument('context', 'string', 'A context defined by torann/json-ld', true);
$this->registerArgument('typoscriptPath', 'array',
'Path to typoscript constants representing the structured data', true);
}
/**
* {@inheritdoc}
*/
public function render()
{
GeneralUtility::makeInstance(PageRenderer::class)->addHeaderData($this->createContext());
}
/**
* {@inheritdoc}
*/
protected function createContext(): string
{
/** @var Context $context */
$context = Context::create($this->arguments['context'], $this->arguments['typoscriptPath']);
return $context->generate();
}
}On constate que j'initialise 2 arguments l'un définit le contexte et l'autre un chemin vers des constantes typoscript.
Imaginons maintenant que je définisse les constantes typoscript suivantes et que je les injecte dans mon template de page principal.
configuration {
organization {
address {
addressCountry = Suisse
addressLocality = Fribourg
addressRegion = FR
postalCode = 1700
streetAddress = Rue du Criblet 9
}
contactPoint {
telephone = +4126 321 30 81
contactType = customer service
}
description = Agence de développement web
email = [email protected]
faxNumber = +4126 321 30 82
logo {
height = 1200
width = 1200
url = https://www.domain.tld/typo3conf/ext/mr_theme/Resources/Public/Images/logo.jpg
}
name = hemmer.ch SA
telephone = +4126 321 30 81
url = https://www.domain.tld
}
}Notez que mes constantes typoscript représentent excatement ce schéma d'organisation et que je pourrais très bien ajouter d'autres attributs.
Je peux donc ensuite appeler mon ViewHelper de cette manière :
<mru:seo.structuredData.fromTyposcript context="organization" typoscriptPath="{configuration.site.organization}"/>Si j'inspecte le code de ma page qui a été générée, je constate que j'ai bien mes données structurées dans ma balise head de cette manière :
<script type="application/ld+json">{"@context":"http:\/\/schema.org","@type":"Organization","name":"hemmer.ch SA","description":"Agence de développement web","url":"https:\/\/www.domain.tld","address":{"@type":"PostalAddress","streetAddress":"Rue du Criblet 9","addressLocality":"Fribourg","addressRegion":"FR","addressCountry":"Suisse","postalCode":"1700"},"logo":{"@type":"ImageObject","url":"https:\/\/www.domain.tld\/typo3conf\/ext\/mr_starter\/Resources\/Public\/Images\/logo.jpg","height":"1200","width":"1200"},"contactPoint":{"@type":"ContactPoint","telephone":"+4126 321 30 81","contactType":"customer service"}}</script>Si je me rends dans l'outil de test de données structurées fourni par Google, je constate également que mes donneés structurées ont bien été générées :
Conclusion
On constate qu'avec le système mis en place, on peut facilement inclure des données structurées dans notre page avec TYPO3. Il suffit de définir des constantes typoscript qui réprésentent un schéma se trouvant dans schema.org, de les inclure dans notre page et d'appeler notre ViewHelper avec les bons paramètres.
On pourrait également afficher des données structurées pour n'importe quel type d'objet extbase en utilisant cette fonctionnalité de la librairie. Je l'ai fait pour des actualités par exemple.
La solution proposée semble être une bonne alternative pour répondre à cette demande.
Si vous désirez en savoir plus, je réponds à toutes vos questions par email à l'adresse [email protected].
