Google Rich Snippets : le fil d'ariane (breadcrumbs)

  • Par Magentix le 10/01/2012
  • Difficulté : 2/4

Google Rich Snippets : le fil d'ariane (breadcrumbs) Les Rich Snippets de Google sont des outils assez puissants. Un excellent moyen d'améliorer l'affichage des résultats de recherche naturels dans le moteur. Voici un exemple d'intégration sur le fil d'ariane de Magento (breadcrumbs).

Le but de l'opération est d'ajouter dans les résultats naturels de Google les catégories de fil d'ariane de la boutique. Le traditionnel lien vers la page de destination sera ainsi remplacé par la hiérarchie des catégories dans lesquelles se trouve le produit :

Rich Snippet Google breadcrumbs

Les Rich Snippets sont extrêmement simples à mettre en place. Paradoxalement peu de boutiques semblent les utiliser à l'heure où j'écris ces lignes.

Principe

Lorsque les rubriques sont balisées par un fil d'ariane, Google peut les identifier et les utiliser pour analyser et présenter les informations sur les résultats de recherche. Pour ce faire, il est possible d'utiliser les microdonnées ou le format RDFa.

Nous utiliserons le format RDFa.

Modification du template

Il nous faut éditer le fichier page/html/breadcrumbs.phtml du template. Ouvrez le fichier puis modifiez le de cette façon :

page/html/breadcrumbs.phtml

<?php if($crumbs && is_array($crumbs)): ?>
<div class="breadcrumbs">
    <ul xmlns:v="http://rdf.data-vocabulary.org/#">
        <?php foreach($crumbs as $_crumbName=>$_crumbInfo): ?>
            <li class="<?php echo $_crumbName ?>" typeof="v:Breadcrumb">
            <?php if($_crumbInfo['link']): ?>
                <a href="<?php echo $_crumbInfo['link'] ?>" title="<?php echo $this->htmlEscape($_crumbInfo['title']) ?>" rel="v:url" property="v:title"><?php echo $this->htmlEscape($_crumbInfo['label']) ?></a>
            <?php elseif($_crumbInfo['last']): ?>
                <strong><?php echo $this->htmlEscape($_crumbInfo['label']) ?></strong>
            <?php else: ?>
                <?php echo $this->htmlEscape($_crumbInfo['label']) ?>
            <?php endif; ?>
            <?php if(!$_crumbInfo['last']): ?>
                <span>/ </span>
            <?php endif; ?>
            </li>
        <?php endforeach; ?>
    </ul>
</div>
<?php endif; ?>

Nous avons apporté 3 modifications :

  • Une déclaration de l'espace de noms avec le code xmlns sur la balise ul.
  • Une identification des rubriques par typeof="v:Breadcrumb" sur la balise li.
  • Une identification sur la balise a à l'aide de la propriété title avec le préfixe v:. L'attribut rel indique que le lien correspond à l'URL de cette catégorie.

Outil de test

Il nous faut maintenant tester l'intégration du Snippet. Pour cela Google met à disposition le Rich Snippets Testing Tool.

Indiquez l'URL de la page à tester. Si tout se passe bien vous devriez obtenir un résultat de ce type :

Rich Snippets Testing Tool

Google nous offre également un aperçu du lien tel qu'il sera présenté dans le moteur. Il ne reste plus qu'à attendre le prochain crawl de Google sur votre site !

Autres Snippets

Pour les boutiques en ligne, Google est capable d'interpréter d'autres balises pour :

  • Les avis clients
  • Les notes associées aux avis
  • Les produits (prix et stock)

La liste complète est disponible dans le centre d'aide Google : Extraits enrichis et balisage structuré. Vous trouverez pour chacun d'eux les propriétés à utiliser.

Au final il est possible d'obtenir dans Google l'affichage suivant :

Rich Snippets Google

Même si votre lien n'apparaît pas dans les premiers résultats, c'est un bon moyen d'attirer l'attention de l'internaute et d'augmenter le nombre de clics sur une requête.

Liens

6

Commentez cet article Google Rich Snippets : le fil d'ariane (breadcrumbs)

Arno Le 10/01/2012 à 15:20
excellent !

t aurais pas un tuto aussi pour les autres Rich Snippets que google recommande pour les produits ?
#1
Magentix Le 10/01/2012 à 15:34
J'ai eu l'occasion de tester sur les avis (çà marche plutôt bien !), mais pas encore sur les produits (prix et stock).

Il y a les infos sur cette page : http://support.google.com/webmasters/bin/answer.py?hl=fr&answer=146750

L'exemple utilise les microdonnées (perso je préfère utiliser rdfa). Je testerai à l'occasion.
#2
Christophe Le 10/01/2012 à 21:11
Belle intégration.
Merci pour le tuto Matt.
Perfect as usual !
#3
Nath4n Le 11/01/2012 à 11:18
T'es vraiment le meilleur ;)
Bonne année 2012 et merci pour tous ces précieux conseils
#4
Aubin Le 15/01/2012 à 10:06
Cela m'intéresse pour les avis. Je pense avoir compris le principe, mais pour les avis, je ne vois pas dans quel fichier intégrer le code
#5
Aubin Le 15/01/2012 à 11:51
Finalement, j'ai trouvé en cherchant un peu (le dimanche, c'est plus dur de se concentrer ^_^')
#6
Rédiger un commentaire

Cliquez pour générer un nouveau code

* champs obligatoires