Prestashop 1.0 à 1.6 : Ajouter un Rich Snippet « fil d’ariane »

Depuis quelques mois, Google met en oeuvre les micro-formats au sein de ses résultats de recherche, et plus particulièrement quelques améliorations visuelles, dont la plus connue est la « review » (issue de votes d’utilisateurs, avec des étoiles apparaissant dans les résultats Google). Il existe d’autres formes de rich snippet, et plus particulièrement ceux liés à la navigation : le fil d’ariane (ou breadcrumbs en anglais) en fait partie.

Fil d'ariane (breadcrumb) apparaissant dans Google

Voici une méthode très simple pour mettre en oeuvre cette forme d’amélioration visuelle sur votre boutique Prestashop, l’objectif étant au final d’attirer l’oeil des internautes et donc d’augmenter (un peu) les clics menant à votre e-commerce !

Structure du Rich Snippet « Breadcrumbs »

Il existe deux formats de métadonnées pour indiquer aux moteurs de recherche la présence d’informations additionnelles dans vos pages : le format Microdata (que nous allons mettre en oeuvre ici) et le format RDFa (ces deux formats de microdonnées sont bien évidemment reconnus par le W3C, dans la mesure où ils en sont issus !)

La syntaxe en Microdata, que nous allons donc mettre en oeuvre, repose sur trois attributs HTML :

  • itemscope (qui définit la balise encadrant la définition des microdonnées)
  • itemtype (qui définit le type de microdonnée définit dans ladite balise)
  • itemprop (qui définit les propriétés contenues par les balises filles encadrées par celle définie par itemscope)

Dans le cas des fils d’Ariane, il y aura donc 2 propriétés à définir : l’adresse du lien (appelée url), et l’ancre de ce dernier (appelée title).

En pratique, cela donne un code ressemblant à ceci :

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> 	<a href="/" title="retour à Accueil" itemprop="url"> 		<span itemprop="title">Accueil</span> 	</a> </div> <div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> 	<a href="/3-cuisson" itemprop="url"> 		<span itemprop="title">Cuisson</span> 	</a> </div> <div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> 	<a href="/8-fourneau" itemprop="url"> 		<span itemprop="title">Fourneau</span> 	</a> </div> Langage du code : HTML, XML (xml)

Ce qui donnera par exemple le résultat visible sur la capture d’écran en début d’article 🙂

L’insertion de ce microformat au niveau du fil d’Ariane de Prestashop nécessite donc d’aller ajouter ces attributs HTML au sein du code généré : pour cela, il va nous falloir (malheureusement) toucher au core de Prestashop…

1ère étape : modifier notre template (thème)

Dans le modèle de template de Prestashop, le fil d’Ariane passe en premier lieu par le fichier breadcrumb.tpl, situé dans votre thème de boutique. Ce fichier contient en réalité le premier niveau de lien pointant vers la homepage de notre site e-commerce (les liens suivants étant générés par une fonction interne à Prestashop, que nous irons modifier en second lieu)

<!-- Breadcrumb --> {if isset($smarty.capture.path)}{assign var='path' value=$smarty.capture.path}{/if} <div class="breadcrumb"> 	<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="{$base_dir}" title="{l s='return to'} {l s='Home'}" itemprop="url"><span itemprop="title">{l s='Home'}</span></a></div>{if isset($path) AND $path}<span class="navigation-pipe">{$navigationPipe|escape:html:'UTF-8'}</span>{if !$path|strpos:'span'}<span class="navigation_page">{$path}</span>{else}{$path}{/if}{/if} </div> <!-- /Breadcrumb --> Langage du code : HTML, XML (xml)

Ce que nous avons modifié :

  • Encadrement du lien (balise A) par une balise DIV définissant l’itemscope et le type de microformat
  • Ajout de l’attribut itemprop dans notre balise A
  • Ajout d’un SPAN avec l’itemprop définissant le texte à afficher, encadrant l’ancre du lien

2ème étape : modifier la fonction générant les liens internes

Je ne détaillerai pas les explications techniques déterminant quelle fonction doit être modifiée, aussi voici directement le code à retoucher, celui même qui génère le fil d’Ariane à partir de l’URL appelée. La fonction à modifier est située dans /classes/Tools.php (attention à procéder à une sauvegarde préalable de tous les fichiers modifiés !)

Si vous utilisez Prestashop 1.6.x

Un excellent tutoriel ici chez Café++ (pas besoin de réinventer ce qui a été très bien fait 😉 )

Si vous utilisez Prestashop 1.5.x

Rendez-vous dans Tools.php, aux environs de la ligne 800, sur la fonction getPath dont voici le code adapté à la version 1.5.x dans ce commentaire 😉  (merci à Radus)

Si vous utilisez Prestashop 1.4.x

Rendez-vous dans Tools.php, aux environs de la ligne 797, sur la fonction getPath dont voici le code modifié :

public static function getPath($id_category, $path = '', $linkOntheLastItem = false, $categoryType = 'products') 	{ 		global $link, $cookie; 		if ($id_category == 1) 			return '<span class="navigation_end">'.$path.'</span>'; 		$pipe = Configuration::get('PS_NAVIGATION_PIPE'); 		if (empty($pipe)) 			$pipe = '>'; 		$fullPath = ''; 		if ($categoryType === 'products') 		{ 			$category = Db::getInstance()->getRow(' 			SELECT id_category, level_depth, nleft, nright 			FROM '._DB_PREFIX_.'category 			WHERE id_category = '.(int)$id_category); 			if (isset($category['id_category'])) 			{ 				$categories = Db::getInstance()->ExecuteS(' 				SELECT c.id_category, cl.name, cl.link_rewrite 				FROM '._DB_PREFIX_.'category c 				LEFT JOIN '._DB_PREFIX_.'category_lang cl ON (cl.id_category = c.id_category) 				WHERE c.nleft <= '.(int)$category['nleft'].' AND c.nright >= '.(int)$category['nright'].' AND cl.id_lang = '.(int)($cookie->id_lang).' AND c.id_category != 1 				ORDER BY c.level_depth ASC 				LIMIT '.(int)$category['level_depth']); 				$n = 1; 				$nCategories = (int)sizeof($categories); 				foreach ($categories AS $category) 				{ 					$fullPath .= 					(($n < $nCategories OR $linkOntheLastItem) ? '<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="'.self::safeOutput($link->getCategoryLink((int)$category['id_category'], $category['link_rewrite'])).'" title="'.htmlentities($category['name'], ENT_NOQUOTES, 'UTF-8').'" itemprop="url"><span itemprop="title">' : ''). 					htmlentities($category['name'], ENT_NOQUOTES, 'UTF-8'). 					(($n < $nCategories OR $linkOntheLastItem) ? '</span></a></div>' : ''). 					(($n++ != $nCategories OR !empty($path)) ? '<span class="navigation-pipe">'.$pipe.'</span>' : ''); 				} 				return $fullPath.$path; 			} 		} 		elseif ($categoryType === 'CMS') 		{ 			$category = new CMSCategory((int)($id_category), (int)($cookie->id_lang)); 			if (!Validate::isLoadedObject($category)) 				die(self::displayError()); 			$categoryLink = $link->getCMSCategoryLink($category); 			if ($path != $category->name) 				$fullPath .= '<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="'.self::safeOutput($categoryLink).'" itemprop="url"><span itemprop="title">'.htmlentities($category->name, ENT_NOQUOTES, 'UTF-8').'</span></a></div><span class="navigation-pipe">'.$pipe.'</span>'.$path; 			else 				$fullPath = ($linkOntheLastItem ? '<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="'.self::safeOutput($categoryLink).'" itemprop="url"><span itemprop="title">' : '').htmlentities($path, ENT_NOQUOTES, 'UTF-8').($linkOntheLastItem ? '</span></a></div>' : ''); 			return self::getPath((int)($category->id_parent), $fullPath, $linkOntheLastItem, $categoryType); 		} 	} Langage du code : PHP (php)

Nous y avons simplement intégré les mêmes éléments que dans notre fichier de template, sur les liens générés via PHP.

Si vous utilisez Prestashop jusqu’aux versions 1.3.x

La fonction getPath étant différente dans les anciennes versions de Prestashop, voici le code fonctionnant avec ces versions (la fonction se trouve vers la ligne 559) :

static public function getPath($id_category, $path = '') 	{ 		global $link, $cookie; 		$category = new Category(intval($id_category), intval($cookie->id_lang)); 		if (!Validate::isLoadedObject($category)) 			die (Tools::displayError()); 		if ($category->id == 1) 			return '<span class="navigation_end">'.$path.'</span>'; 		$pipe = (Configuration::get('PS_NAVIGATION_PIPE') ? Configuration::get('PS_NAVIGATION_PIPE') : '>'); 		$category_name = Category::hideCategoryPosition($category->name); 		if ($path != $category_name) 			$path = '<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="'.Tools::safeOutput($link->getCategoryLink($category)).'" itemprop="url"><span itemprop="title">'.$category_name.'</span></a></div> '.$pipe.' '.$path; 		return Tools::getPath(intval($category->id_parent), $path); 	} Langage du code : PHP (php)

Nous y avons réalisé strictement la même opération ! En fait, Prestashop, jusqu’aux versions 1.3.x, n’incluait pas un fil d’Ariane identique selon que les pages produit étaient appelées depuis une page catégorie ou directement, ce qui explique la légèreté du code…

3ème étape : retoucher la feuille de style CSS !

Ridiculement simple mais néanmoins indispensable si vous ne voulez pas d’un fil d’Ariane en vrac dans votre boutique, il vous faut retoucher très légèrement la feuille de style global.css de votre thème (située dans le sous-répertoire /css/ de ce dernier), simplement ajoutant la définition suivante (qui évite aux balises DIV contenues dans la classe .breadcrumb d’être affichées en bloc par défaut, mais bien en ligne dans le flux)

.breadcrumb div { 	display: inline; } Langage du code : CSS (css)

Pour des raisons de propreté, veillez à intégrer cette définition au bon endroit dans votre feuille de style (même si cela fonctionnera si vous l’ajoutez simplement à la fin !)

Mise en place et conclusion

La mise en place sur la boutique ne pose pas de problèmes particuliers, si ce n’est que je vous conseille de procéder par ordre inversé : diffuser d’abord la feuille de style, puis le code PHP et Smarty ! En effet, cela évitera à vos visiteurs d’avoir (momentanément) un fil d’Ariane en vrac lorsque vous mettrez en place ce petit artifice !

Concernant le délai de prise en compte par Google, compter environ 1 à 3 semaines (c’est parfois très rapide !) même si ce n’est pas forcément mis en oeuvre sur toutes les pages de la boutique !

Voir tous les articles de la catégorie Prestashop

84 réflexions sur “Prestashop 1.0 à 1.6 : Ajouter un Rich Snippet « fil d’ariane »”

  1. Avatar de Testeur

    Merci pour cette astuce, excellent tutoriel, j’attend avec impatience de voir les liens google avec leur nouvelle structure. Merci beaucoup pour ce post !

    Répondre
  2. Avatar de Rahsan

    Merci pour ce tutoriel, j el’avais fait « à la main » dans breadcrumb et c’est bien mieux dans tools.php

    Répondre
  3. Avatar de Graphemeride

    As-tu déjà des sites à toi qui affichent déjà le snippet dans les résultats de recherche?

    Répondre
    1. Avatar de Cédric GIRARD
      Cédric GIRARD

      Oui bien sûr 😉

      Toute les boutiques en ligne sur lesquelles j’ai mis en place l’astuce ! Pas sur toutes les pages, mais la plupart.

      C’est notamment le cas de la première que j’ai créée, Master Matériel.

      Répondre
  4. Avatar de emilian

    Merci beaucoup pour cette merveilleuse information!

    Because of my poor french, i will say it in english: it’s working, but only for a breadrumb like this:

    Home> Categ > SubCateg>Product

    I need the code to work for the sequence:
    Home> Categ >Product

    I have replaced in Tools.php – la ligne 10 de getPath function:

    $pipe = ‘>’; with $pipe = ‘>’;

    but it’s not working, because the second « > » must be translated also in « > » – as it can be seened in the Source Code after replacement in order to be a rich snippet.

    Je spere que vous avez une solution pour cette detaille, merci beaucoup anticipe!

    Répondre
    1. Avatar de Cédric GIRARD
      Cédric GIRARD

      Hi Emilian

      It seems working with your second case for me. I tested it on several websites.

      Répondre
  5. Avatar de Djolhan de l
    Djolhan de l'annuaire hdclic

    Je regardais tes articles sur prestashop, je tombe sur celui la, et je me dis, tiens, vais transformer mon fil d’arianne sur mon annuaire pour voir ce que ça donne.

    Affaire à suivre, et merci pour les infos.

    Répondre
  6. Avatar de Djolhan@module prestashop
    Djolhan@module prestashop

    Bon, et bien, ca fonctionne très bien, les derniers articles ont l’affichage du Rich Snippet dans google.

    Merci 😉

    Répondre
  7. Avatar de Na Ścianę

    I’d like to say thanks for this quick solution, but I have seen here that the « last item » in breadcrumb is not tagged correctly with title.

    In my site I’ve this code for example:
    <!-- Breadcrumb -->

    <a href="http://naklejki-dekoracyjne.pl/" title="wr&oacute;ć do Strona gł&oacute;wna">Strona gł&oacute;wna</a>&gt;<a href="http://naklejki-dekoracyjne.pl/8-kobiety-naklejki-i-szablony-malarskie" title="kobiety">kobiety</a>&gt;twarz kobiety
    <!-- /Breadcrumb -->

    Twarz kobiety (last item) is not tagged & this is not a link.

    How to fix this? I think that all of the item in breadcrumb should be tagged then google can read this.

    Répondre
    1. Avatar de Cédric GIRARD
      Cédric GIRARD

      Hi

      Indeed, the last item is usually the category name if we’re on a category page, or the product name if we’re on a product page.

      That’s why there isn’t any link on it. If you want to add a link on it, you’ve to modify the template part.

      Répondre
  8. Avatar de mikael

    Très bon tuto.
    La question que je me pose est :

    Quel est le réel avantage d’afficher son fil d’ariane sur Google?

    Répondre
    1. Avatar de Cédric GIRARD
      Cédric GIRARD

      Bonjour Mikaël

      On va dire que c’est plus « user friendly » pour les utilisateurs arrivant sur Google (même si l’impact est minime au niveau trafic !)

      Répondre
  9. Avatar de Loic viandier

    Bonjour excellent tutoriel!
    Est ce que cela active simplement le fil d’Ariane ou également tous les autres snippets comme la review par exemple(les étoiles sur les résultats de recherche)?
    Faut-il une manipulation pour chaque snippet?

    Répondre
    1. Avatar de Cédric GIRARD
      Cédric GIRARD

      Bonjour Loïc

      À chaque snippet sa manipulation… Je posterai prochainement un article à ce propos 😉

      Répondre
  10. Avatar de Florian

    Il faut vraiment que je bookmark cet article, très utile et finalement assez simple à mettre en place (du moins parce que c’est très bien expliqué).

    Mis en place plusieurs fois et le résultat rend la navigation dans les résultats plus ergonomique.

    Répondre
  11. Avatar de Bertrand

    Quelqu’un a-t-il un tuto pour fairs apparaitre l’image d’un product dans les SERP ?
    Suffit-il de rajouter les bon attribut en html sur la fiche produit?

    Répondre
  12. Avatar de michou

    bonsoir,

    faut il remplacer le contenu de Breadcrumb.tpl par le code que vous donnez ou juste l’ajouter dans breadcrumb.tpl ?

    Répondre
    1. Avatar de Cédric GIRARD

      Bonjour

      Il faut remplacer le code correspondant qui est entre les balises 😉

      Répondre
  13. Avatar de dimitri

    Merci, du lourd cet article, je suis tombé dessus durant mes recherches sur les microformats et prestashop et la c’est très bien expliqué, je vais m’empresser de mettre cela en place sur mes sites, merci encore pour le partage 😉

    Répondre
  14. Avatar de proceed

    Salut!
    Merci beaucoup pour cette manual!

    Mais, il y a une probleme avec tools.php (pour prestashop 1.3)

    J’ai la subcategorie, et la derniere element de « breadcrumbs » n’est pas lien (link). Comme j’ai compris, pour realiser cette il faut ajouter link dans cette code:

    if ($path != $category_name)
    $path = '<a>getCategoryLink($category)).'" itemprop="url"&gt;'.$category_name.'</a> '.$pipe.' '.$path;

    A la place de derniere $path il faut ajouter autre code. Mais je sais pas 🙁
    Aidez-moi, s’il vous plait.

    Pardonne-moi pour les fautes en francais. Je suis ukrainien)

    Répondre
    1. Avatar de proceed

      Oh, non( Tag « code » ne travail pas.
      Voila la code:
      if ($path != $category_name)
      $path = '<a>getCategoryLink($category)).'" itemprop="url"&gt;'.$category_name.'</a> '.$pipe.' '.$path;

      Répondre
    2. Avatar de Cédric GIRARD
      Cédric GIRARD

      Bonjour Proceed

      (félicitations pour ton français !)

      En principe le dernier élément désigne la page en cours, il est normal qu’il n’y ait pas de lien dessus, non ?

      Répondre
      1. Avatar de proceed

        Merci, pour réponse!
        Oui, vous avez la raison 🙂 C’est l’avant-dernier élément. Voila, j’ai fait la screenshot http://ge.tt/8ZmDekL/v/0

        Répondre
        1. Avatar de Cédric G.

          Ah.

          Et vous avez scrupuleusement utilisé le code ci-dessus ?

          Parce que j’ai testé sur 4 boutiques différentes (v1.1 à 1.4.7), ça fonctionne très bien 🙂

          Répondre
          1. Avatar de proceed

            Oui, tres scrupuleusement. Si vous aurez le temps, regarder s’il vous plait mes files. Les changements au ligne #650
            Voila: c’est Tools.php natale http://ge.tt/8krBllL/v/0
            Et c’est Tools.php modifié http://ge.tt/1ulIolL/v/0

            Version prestashop 1.3.6

            Merci beaucoup par avance

  15. Avatar de nico

    Bonjour Cedric et merci pour cette article bien utile.
    J’ ai une petite question :
    dans le tpl tu ouvres un div itemscope itemtype mais il se ferme à quel moment car à la fin de ta ligne il n’est pas fermé est ce normal?
    Merci

    Répondre
  16. Avatar de Patrick

    Bonjour,

    Merci pour ce post, je viens de faire la modif et j’attends le passage de Google.
    Un grand merci pour ce tuto, clair et surtout sans bug, ce qui n’est pas négligeable.
    Je ne manquerais pas de te tenir informé des avancées de GWT.
    A j’oubliais, avant ta modif, j’avais la catégorie dans le fil d’Ariane en, double, et après ta modif, c’est pareil, tu n’aurais pas une idée ?
    Bonne rentrée,
    Patrick

    Répondre
  17. Avatar de Patrick

    Ça y est, premières retombées sur GWT, 10 éléments et 8 Pages.
    Donc en une semaine ça bouge.

    Merci encore et bon vent

    Patrick

    Répondre
  18. Avatar de Estelle

    Bonjour,

    Parfait !

    Quelqu’un a t-il essayé le module Gratuit :

    « Module Rich Snippets and Semantic SEO with GoodRelations » ?

    Par avance merci,

    Estelle

    Répondre
  19. Avatar de Bijouifique

    Bonjour,

    Merci pour cet article , et merci Estelle pour le module gratuit , je vais tester !

    Répondre
  20. Avatar de Tchupa

    Salut,

    merci Effi pour ce tutoriel par contre petite précision si vous ne voyez pas les changements quand vous testez dans webmastertool n’oubliez pas de forcer la compilation avant de demander l’aperçu et surtout n’oubliez surtout pas de désactiver la compilation après avoir tout mis en place correctement.

    Tchupa.

    Répondre
  21. Avatar de Dorje

    Hello
    well thanks for the great code. i inserted it into my store’s page and it worked correctly and now GWT is also showing that 180 pages are indexed as rich snippet but i do want to know that it’s not showing the serp results.
    i typed every query for which i do rank but nothing is showing up/….
    Any ideas?

    Répondre
    1. Avatar de Cédric GIRARD

      Hi

      You have to wait now. Indeed, Google doesn’t include rich snippets immediatly, it can take several weeks before showing new snippets…

      Répondre
  22. Avatar de Yonni

    Super ! C’est bien sympa de partager çà, j’ai hâte de voir ce que çà donner ! MERCI BEAUCOUP !

    Répondre
  23. Avatar de Roni

    Bonsoir,

    Merci pour ce tuto bien construit et très clair pour les plus novice 🙂

    Après avoir fait les modifications, j’ai fait un diag avec seoQuake et woorank mais il ne trouve pas de balise microformat.

    Est-ce normal ?

    Merci

    Répondre
  24. Avatar de Dorje

    HEy again
    Google has indexed these snippet in 508 pages but none of them the snippet in the serp. Don’t know what’s going on ???

    Répondre
  25. Avatar de Mathieu

    Bonjour,

    Est-ce que ces modifications s’appliquent également pour Prestashop 1.5.2 ?

    D’avance merci !
    Mathieu

    Répondre
  26. Avatar de sami24

    Bonjour, tout d’abord merci pour ce tuto
    sur prestashop 1.4 on doit modifier Tools.php mais comment doit on effectuer cette modification? Doit-on aller dans override/classes/_Tools.php et insérer la modification
    merci pour votre aide

    Répondre
  27. Avatar de Romain

    Intéressant, mais il serait aussi pertinent de développer les autres types de microformats (prix, reviews etc)qui sont eux aussi très puissant en visibilité / CTR!

    Répondre
  28. Avatar de andreea effingo
    andreea effingo

    Merci beaucoup pour cet article!
    J’ai utilise cettes instructions sur ma Presta platforme et Google Snippet Tool indiquee les pages interieures enrichee avec microformat schema.org, j’attend voir ca dans le resultates listes.
    Encore une fois, merci!

    Répondre
  29. Avatar de Nicolas

    Salut Mister !

    Je passais par hasard juste pour te dire que c’était du bon boulot : je m’étais échiné pour trouver le moyen d’insérer un Rich Snippet de ce style sur OsCommerce …

    D’ailleurs à ce propos : est-ce que Prestashop est la meilleure solution pour site e-commerce pour toi ?

    Répondre
    1. Avatar de Patrick

      Salut Nicolas,

      J’utilise Prestashop depuis 3 ans pour 2 boutiques, dans l’ensemble j’en suis assez satisfait.
      Mais comme je dis toujours , le meilleur logiciel du monde est celui qu’on utilise.
      Le forum n’est pas trop mal, surtout l’anglais, car le français est juste au niveau des réponses au problèmes.
      Et leur hotline par mail est presque inexistante.
      Mais si on connait un peu le CSS et le PHP on s’en sort bien.
      Bon courage
      Patrick

      Répondre
      1. Avatar de Nicolas

        D’accord.

        Merci pour ton retour.

        Comme tu l’as compris, j’ai pour habitude d’utiliser OsCo mais bon … Il se fait vieux même si j’ai pas mal re-développé.

        Là en ce moment, je cherche une solution e-commerce moins lourde tout en étant puissante et flexible.

        Répondre
  30. Avatar de radus

    Salut Cedric et un GRAND MERCI pour cette post,

    La 2eme etape: modifier la fonction generant les liens, version 1.4 ca marche aussi pour 1.5 ?

    [ Excusez-moi pour la langue, je ne suis pas francais, mais je comprend un peux ]

    r

    Répondre
  31. Avatar de radus

    Salut Cedric,

    Pour non programateur, j’ai attache mon code pour 1.5.3 concernant 2-eme etape : modifier la fonction generant les liens internes.

    public static function getPath($id_category, $path = '', $link_on_the_item = false, $category_type = 'products', Context $context = null)
    {
    if (!$context)
    $context = Context::getContext();

    $id_category = (int)$id_category;
    if ($id_category == 1)
    return ''.$path.'';

    $pipe = Configuration::get('PS_NAVIGATION_PIPE');
    if (empty($pipe))
    $pipe = '&gt;';

    $full_path = '';
    if ($category_type === 'products')
    {
    $interval = Category::getInterval($id_category);
    $id_root_category = $context-&gt;shop-&gt;getCategory();
    $interval_root = Category::getInterval($id_root_category);
    if ($interval)
    {
    $sql = 'SELECT c.id_category, cl.name, cl.link_rewrite
    FROM '._DB_PREFIX_.'category c
    LEFT JOIN '._DB_PREFIX_.'category_lang cl ON (cl.id_category = c.id_category'.Shop::addSqlRestrictionOnLang('cl').')
    WHERE c.nleft = '.$interval['nright'].'
    AND c.nleft &gt;= '.$interval_root['nleft'].'
    AND c.nright language-&gt;id.'
    AND c.active = 1
    AND c.level_depth &gt; '.(int)$interval_root['level_depth'].'
    ORDER BY c.level_depth ASC';
    $categories = Db::getInstance()-&gt;executeS($sql);

    $n = 1;
    $n_categories = count($categories);
    foreach ($categories as $category)
    {
    $full_path .=
    (($n &lt; $n_categories || $link_on_the_item) ? &#039;<a>link-&gt;getCategoryLink((int)$category['id_category'], $category['link_rewrite'])).'" title="'.htmlentities($category['name'], ENT_NOQUOTES, 'UTF-8').'" itemprop="url"&gt;' : '').
    htmlentities($category['name'], ENT_NOQUOTES, 'UTF-8').
    (($n &lt; $n_categories || $link_on_the_item) ? &#039;</a>' : '').
    (($n++ != $n_categories || !empty($path)) ? ''.$pipe.'' : '');
    }

    return $full_path.$path;
    }
    }
    else if ($category_type === 'CMS')
    {
    $category = new CMSCategory($id_category, $context-&gt;language-&gt;id);
    if (!Validate::isLoadedObject($category))
    die(Tools::displayError());
    $category_link = $context-&gt;link-&gt;getCMSCategoryLink($category);

    if ($path != $category-&gt;name)
    $full_path .= '<a href="safeOutput($category_link).'" rel="nofollow ugc">'.htmlentities($category-&gt;name, ENT_NOQUOTES, 'UTF-8').'</a>'.$pipe.''.$path;
    else
    $full_path = ($link_on_the_item ? '<a href="safeOutput($category_link).'" rel="nofollow ugc">' : '').htmlentities($path, ENT_NOQUOTES, 'UTF-8').($link_on_the_item ? '</a>' : '');

    return Tools::getPath($category-&gt;id_parent, $full_path, $link_on_the_item, $category_type);
    }
    }

    Répondre
    1. Avatar de trololo

      je ne vois a aucun moment ou est la modification, le code est à l’origine comme ça…

      Répondre
  32. Avatar de radus

    Salut Cedric,

    Could you PLEASE publish the code that makes active the last hyperlink of the product in snippet ?

    I am on PS 1.5 but if you publish for 1.4, I may be able to use it.

    3 good reasons for having it:

    1. SEO page on G search : page relevancy score increases as Page Title is similar to Page URL .

    2. Adwords quality score increases and we pay less but display higher the advert, for same adverts.

    3. Rich snippet displays Page Title as last active link, and this looks better than a classic URL

    However, you are right, from navigational perspective, it brings no additional benefit.

    Overall, it pays to have it and I encourage all to use it.

    Many thanks,

    R

    Répondre
    1. Avatar de Cédric GIRARD

      Hi Radus

      You just have to find the getPath function call to modify the « path » variable 🙂

      Répondre
  33. Avatar de Semara

    Merci beaucoup pour ce tutorial.
    J’ai tout de même une question, est ce que la deuxième était marche aussi sous la version 1.5 ? Ou faut-il modifier quelques parties, si oui, lesquelles ?

    Répondre
  34. Avatar de Semara

    J’ai une autre question du coup,

    Est-il possible de faire pareil en ajoutant et les itemscop qui vont avec ?

    Répondre
    1. Avatar de Semara

      Je m’autoréponds, car je viens de trouver comment faire et j’en ai fait un tutoriel sur mon blog, si ça intéresse des gens :
      http://helran.fr/2013/03/14/tutoriel-ajouter-des-microdonnees-relatives-au-produit-dans-prestashop/

      Répondre
      1. Avatar de Cédric GIRARD
        Cédric GIRARD

        Bonjour Semara

        Merci pour l’astuce !!!

        Pour le moment je n’ai pas encore touché à Prestashop 1.5.x donc je ne peux pas répondre à votre première question, mais cela ne saurait tarder car j’ai un projet professionnel qui arrive sur cette thématique.

        Répondre
  35. Avatar de hanouka

    Salut, merci pour ce super tuto, est il possible de le mettre a jours des que des infos pour PS 1.5 sont disponible de ton coté. Car je ne sais pas si la manip marche pour PS 1.5. Merci encore 🙂

    Répondre
  36. Avatar de Victor

    Personnellement je trouve que ça a vraiment de l’utilité, je l’utilise pour mon blog et on peut vraiment voir la différence notamment sur google actualités.

    Répondre
  37. Avatar de Adrian Zaharia

    ce poste est d’une importance exceptionnelle, qui m’a beaucoup à plusieurs reprises dans le développement web et la conception aidé.
    merci beaucoup pour cettes informationnes!

    Répondre
  38. Avatar de SPKF

    Très bon article, merci !
    Cependant, je me pose une question, est-on obligé d’ajouter le div :

    à chaque lien interne ? Etant donné qu’on ouvre une premiere fois le div dans le TPL nul besoin de l’ajouter à chaque fois ?
    J’ai fais le test en mettant ce div qu’une fois et google aime bien, du moins sur son outil de test, après en prod, je ne sais pas encore.

    Très bonne continuation !

    Répondre
  39. Avatar de nicou31

    Bonjours,
    Cela fonctionné très bien sous prestashop 1.5.4 Puis vient la mise a jour 1.5.5 donc j’ai tout recommençais et cela fonctionne donc pur ce qui ce posée la question cela fonctionne aussi sur le 1.5.X
    cordialement.

    Répondre
  40. Avatar de Dago

    Merci pour l’astuce Cédric !
    A priori ça fonctionne bien sauf que j’ai un « root » qui s’affiche juste après l’accueil, je comprend pas pourquoi ! C’est une catégorie qui n’existe pas sur mon presta donc je me demande bien d’ou ça sort ? j’ai utilisé ton code pour tool.php mais je suis en 1.5.4.1
    Saurais tu pourquoi ?
    Merci 😉

    Répondre
    1. Avatar de Dago

      Edit : ça m’a l’air ok, j’ai du supprimer la catégorie 65 (aucunes idées du pourquoi elle était là et en root surtout) directement dans la BDD et ça fonctionne ! Merci !

      Répondre
  41. Avatar de trololo

    l’astuce ne fonctionne pas sous 1.5.x merci de ne pas induire les gens en erreur!!

    vous pouvez effacer la globalité du code pour mettre celui proposer mais si on l’a changé c’est pour de bonne raison!!!

    Répondre
    1. Avatar de Cédric GIRARD

      Bonjour

      Les numéros de version sont bien indiqués dans l’article (article écrit AVANT la sortie des versions 1.5.x)

      Merci de… lire l’article dans sa totalité !

      Répondre
      1. Avatar de Dago

        Alors si ça marche pour la 1.5 (en tout cas 1.5.4.1)
        Par contre effectivement, comme mon message du dessus, finalement y’a un « root » qui s’affiche juste après l’accueil
        Du coup j’ai essayé de la supprimer, ça marchait bien mais ça m’a fait disparaitre la catégorie accueil dans le BO…
        Quand je clique sur le lien root, ça m’amène à une page qui n’existe pas sur mon site.
        La solution que j’ai trouvé pour le moment c’est de la renommer et de laisser le champs nom vide.
        Ca donne ça en gros :
        Accueil > > Accessoires
        Au lieu de
        Accueil > Accessoires

        Tu saurais me dire ou est le soucis Cedric ? Merci à toi pour ton code en tout cas 🙂

        Répondre
  42. Avatar de Fab

    Merci pour ce super tuto !! Trifouiller le code c’est mieux que d’acheter un module, non ?

    Répondre
  43. Avatar de Aurélien Debord
    Aurélien Debord

    Testé et approuvé, cela fonctionne bien. Vraiment utile et efficace !

    Répondre
  44. Avatar de Martin

    Bonjour,

    J’utilise Prestashop 1.5.6 et lorsque je modifie le fichier Tools.php avec votre morceau de code, j’ai des erreurs dans mon code qui fait que mon site ne s’affiche même plus. Est ce que vous avez une solution svp ?

    Répondre
  45. Avatar de François

    Les rich snippets sont devenus un « must be » dans l’e-commerce. Pour les entreprises qui commercialisent leurs produits en ligne, c’est un facteur de crédibilité aussi efficace que les témoignages clients. Merci de vos conseils.

    Répondre
  46. Avatar de Joffrey

    Super article qui m’a aidé à mettre le fil d’Ariane en place sur un Presta 1.5.

    J’ai cependant noté une erreur. L’élément « child » doit être imbriqué dans sa catégorie mère, ce qui n’est pas le cas avec votre code.

    Je l’ai remarqué dès le code que vous citez en exemple tout en haut de cette page.

    Pour que les div soient imbriquées, et non pas l’une derrière l’autre comme votre exemple, il faut fermer les div uniquement à la fin de la fontion et non pas à chaque fin de lien.

    Ne pas mettre :
    (($n < $n_categories || $link_on_the_item) ? '' : '').
    Mais :
    (($n < $n_categories || $link_on_the_item) ? '' : '').

    Et juste avant return $full_path.$path;

    Rajouter la ligne foreach ($categories as $category) {$full_path .= '';}

    De cette manière on ouvre les div une à une en parcourant le $path, sans les refermer (donc elles sont imbriquées) et à la fin on referme autant de div que l’on en a ouvert.

    J’ai vérifié les recommandations de Google et il est bien précisé qu’elles doivent être imbriquées.

    Dans votre code on a en fil d’ariane :
    Accueil > Catégorie
    > Sous-catégorie
    > Sous-sous-catégorie
    ….

    Au lieu d’avoir
    Accueil > Catégorie > Sous-catégorie > Sous-sous-catégorie > …

    Répondre
  47. Avatar de Nathalie

    Bonjour,

    Je suis complètement novice en Prestashop. J’ai la version 1.5.6.2 et depuis que nous avons installée le breadcrumb j’ai noté que tous les meta title et meta descriptions étaient en duplicate content ! Les produits sont effectivement rentrés dans une catégorie et une sous-catégorie.

    La case « utiliser l’url canonique » dans presta est bien cochée pourtant…

    Savez-vous maintenant que vous connaissez un peu mieux la version 1.5, d’où peut venir le problème et comment le corriger ?

    Merci et bon week-end !

    Répondre
  48. Avatar de Cédric GIRARD
    Cédric GIRARD

    Bonjour à tous

    Petite mise à jour avec un lien vers un article expliquant comment faire cette manipulation avec la dernière version en date de Prestashop (1.6)

    Répondre
  49. Avatar de Élise

    Bonjour,
    Merci pour votre tuto.
    J’utilise prestashop 1.5.6.2 mais après avoir override la class,j’ai une page blanche.
    Pouvez-vous m’aider svp?

    Répondre
    1. Avatar de Cédric GIRARD
      Cédric GIRARD

      Bonjour

      Postez votre code (attention à utiliser la balise telle que décrite sous la zone de saisie des commentaires 😉 )

      Répondre
      1. Avatar de elise

        Voici le fichier breadcrumb.tpl
        <!-- Breadcrumb -->
        {if isset($smarty.capture.path)}{assign var='path' value=$smarty.capture.path}{/if}

            <a href="{$base_dir}" title="{l s='return to'} {l s='Home'}" rel="nofollow ugc">{l s='Home'}</a>{if isset($path) AND $path}{$navigationPipe|escape:html:'UTF-8'}{if !$path|strpos:'span'}{$path}{else}{$path}{/if}{/if}

        <!-- /Breadcrumb -->

        Voici la class Tools :

        ';
        $full_path = »;
        if ($category_type === 'products')
        {
        $interval = Category::getInterval($id_category);
        $id_root_category = $context-&gt;shop-&gt;getCategory();
        $interval_root = Category::getInterval($id_root_category);
        if ($interval)
        {
        $sql = 'SELECT c.id_category, cl.name, cl.link_rewrite
        FROM '._DB_PREFIX_.'category c
        LEFT JOIN '._DB_PREFIX_.'category_lang cl ON (cl.id_category = c.id_category'.Shop::addSqlRestrictionOnLang('cl').')
        WHERE c.nleft = '.$interval['nright'].'
        AND c.nleft &gt;= '.$interval_root['nleft'].'
        AND c.nright language-&gt;id.'
        AND c.active = 1
        AND c.level_depth &gt; '.(int)$interval_root['level_depth'].'
        ORDER BY c.level_depth ASC';
        $categories = Db::getInstance()-&gt;executeS($sql);
        $n = 1;
        $n_categories = count($categories);
        foreach ($categories as $category)
        {
        $full_path .=
        (($n getCategoryLink((int)$category['id_category'], $category['link_rewrite'])).' » title= »'.htmlentities($category['name'], ENT_NOQUOTES, 'UTF-8').' » itemprop= »url »&gt;' : »).
        htmlentities($category['name'], ENT_NOQUOTES, 'UTF-8').
        (($n language-&gt;id);
        if (!Validate::isLoadedObject($category))
        die(Tools::displayError());
        $category_link = $context-&gt;link-&gt;getCMSCategoryLink($category);
        if ($path != $category-&gt;name)
        $full_path .= ''.htmlentities($category-&gt;name, ENT_NOQUOTES, 'UTF-8').''.$pipe. ».$path;
        else
        $full_path = ($link_on_the_item ? '' : »).htmlentities($path, ENT_NOQUOTES, 'UTF-8').($link_on_the_item ? '' : »);
        return Tools::getPath($category-&gt;id_parent, $full_path, $link_on_the_item, $category_type);
        }
        }
        }

        Merci d’avance Cédric

        Répondre
          1. Avatar de Cédric GIRARD

            Ce que vous pouvez faire déjà, c’est activer le mode debug de Prestashop 😉

            Ainsi vous verrez directement où sont les erreurs.

            Pour ce faire en version 1.5.x, voir le fichier fichier config.inc.php (placer erreurs à true, debug sql à on) et le fichier define.inc.php (mod_dev à true)

  50. Avatar de nico

    Bonjour,

    Comment faire en 1.6.1 ? le tools.php n’existe pas dans override …

    Merci

    Répondre

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Retour en haut