Prestashop : 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>

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 -->

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 David Fieffé (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);
		}
	}

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);
	}

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;
}

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 !

84 commentaires sur Prestashop : Ajouter un Rich Snippet « fil d’ariane »
  1. Testeur Répondre

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

  2. Rahsan Répondre

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

  3. Graphemeride Répondre

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

    • Cédric GIRARD Répondre

      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

  4. emilian Répondre

    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!

    • Cédric GIRARD Répondre

      Hi Emilian

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

  5. emilian Répondre

    by the second « > » must read  » & g t ; « 

  6. Djolhan de l'annuaire hdclic Répondre

    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.

  7. Djolhan@module prestashop Répondre

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

    Merci 😉

  8. Na Ścianę Répondre

    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:

    Strona główna>kobiety>twarz kobiety

    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.

    • Cédric GIRARD Répondre

      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.

  9. mikael Répondre

    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?

    • Cédric GIRARD Répondre

      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 !)

  10. Loic viandier Répondre

    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?

    • Cédric GIRARD Répondre

      Bonjour Loïc

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

  11. Loic viandier Répondre

    Ok Merci!

  12. Florian Répondre

    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.

  13. Bertrand Répondre

    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?

  14. michou Répondre

    bonsoir,

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

    • Cédric GIRARD Répondre

      Bonjour

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

  15. dimitri Répondre

    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 😉

  16. proceed Répondre

    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 = 'getCategoryLink($category)).'" itemprop="url">'.$category_name.' '.$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)

    • proceed Répondre

      Oh, non( Tag « code » ne travail pas.
      Voila la code:
      if ($path != $category_name)
      $path = ‘getCategoryLink($category)).' » itemprop= »url »>’.$category_name.’ ‘.$pipe.’ ‘.$path;

      • radus Répondre

        proceed,

        I have no luck , can you please be more specific ?

        thanks in advance,

        r

    • Cédric GIRARD Répondre

      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 ?

      • proceed Répondre

        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

        • Cédric G. Répondre

          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 🙂

          • 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

  17. Ivan Répondre

    This works like a charm ! Thank you very much for so clear tutorial.

  18. nico Répondre

    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

  19. nico Répondre

    c’est bon je vient de voir encore merci pour l article

  20. Patrick Répondre

    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

  21. Patrick Répondre

    Ç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

  22. Estelle Répondre

    Bonjour,

    Parfait !

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

    « Module Rich Snippets and Semantic SEO with GoodRelations » ?

    Par avance merci,

    Estelle

  23. Bijouifique Répondre

    Bonjour,

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

  24. Tchupa Répondre

    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.

  25. Dorje Répondre

    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?

    • Cédric GIRARD Répondre

      Hi

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

  26. Yonni Répondre

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

  27. Roni Répondre

    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

  28. Dorje Répondre

    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 ???

  29. Mathieu Répondre

    Bonjour,

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

    D’avance merci !
    Mathieu

  30. sami24 Répondre

    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

  31. Romain Répondre

    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!

  32. andreea effingo Répondre

    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!

  33. Nicolas Répondre

    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 ?

    • Patrick Répondre

      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

      • Nicolas Répondre

        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.

  34. radus Répondre

    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

  35. radus Répondre

    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 = ‘>’;

    $full_path =  »;
    if ($category_type === ‘products’)
    {
    $interval = Category::getInterval($id_category);
    $id_root_category = $context->shop->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 >= ‘.$interval_root[‘nleft’].’
    AND c.nright language->id.’
    AND c.active = 1
    AND c.level_depth > ‘.(int)$interval_root[‘level_depth’].’
    ORDER BY c.level_depth ASC’;
    $categories = Db::getInstance()->executeS($sql);

    $n = 1;
    $n_categories = count($categories);
    foreach ($categories as $category)
    {
    $full_path .=
    (($n < $n_categories || $link_on_the_item) ? 'link->getCategoryLink((int)$category[‘id_category’], $category[‘link_rewrite’])).' » title= »‘.htmlentities($category[‘name’], ENT_NOQUOTES, ‘UTF-8′).' » itemprop= »url »>’ :  »).
    htmlentities($category[‘name’], ENT_NOQUOTES, ‘UTF-8’).
    (($n < $n_categories || $link_on_the_item) ? '
    ‘ :  »).
    (($n++ != $n_categories || !empty($path)) ?  ».$pipe. » :  »);
    }

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

    if ($path != $category->name)
    $full_path .= ‘‘.htmlentities($category->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->id_parent, $full_path, $link_on_the_item, $category_type);
    }
    }

    • trololo Répondre

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

  36. radus Répondre

    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

    • Cédric GIRARD Répondre

      Hi Radus

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

  37. Semara Répondre

    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 ?

  38. Semara Répondre

    J’ai une autre question du coup,

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

  39. hanouka Répondre

    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 🙂

  40. Victor Répondre

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

  41. Adrian Zaharia Répondre

    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!

  42. SPKF Répondre

    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 !

  43. Manuel Répondre

    Merci !

    Et pour la partie produit, y a t’il un tutoriel ?

    Merci bien

  44. nicou31 Répondre

    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.

  45. Dago Répondre

    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 😉

    • Dago Répondre

      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 !

  46. trololo Répondre

    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!!!

    • Cédric GIRARD Répondre

      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é !

      • Dago Répondre

        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 🙂

  47. Fab Répondre

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

  48. Aurélien Debord Répondre

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

  49. Martin Répondre

    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 ?

  50. François Répondre

    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.

  51. Joffrey Répondre

    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 > …

  52. Nathalie Répondre

    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 !

  53. David Fieffé Répondre

    Merci Cédric pour le feedback 🙂

  54. Cédric GIRARD Répondre

    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)

  55. Élise Répondre

    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?

    • Cédric GIRARD Répondre

      Bonjour

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

      • elise Répondre

        Voici le fichier breadcrumb.tpl

        {if isset($smarty.capture.path)}{assign var='path' value=$smarty.capture.path}{/if}

            {l s='Home'}{if isset($path) AND $path}{$navigationPipe|escape:html:'UTF-8'}{if !$path|strpos:'span'}{$path}{else}{$path}{/if}{/if}

        Voici la class Tools :

        ';
        $full_path = »;
        if ($category_type === 'products')
        {
        $interval = Category::getInterval($id_category);
        $id_root_category = $context->shop->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 >= '.$interval_root['nleft'].'
        AND c.nright language->id.'
        AND c.active = 1
        AND c.level_depth > '.(int)$interval_root['level_depth'].'
        ORDER BY c.level_depth ASC';
        $categories = Db::getInstance()->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 »>' : »).
        htmlentities($category['name'], ENT_NOQUOTES, 'UTF-8').
        (($n language->id);
        if (!Validate::isLoadedObject($category))
        die(Tools::displayError());
        $category_link = $context->link->getCMSCategoryLink($category);
        if ($path != $category->name)
        $full_path .= ''.htmlentities($category->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->id_parent, $full_path, $link_on_the_item, $category_type);
        }
        }
        }

        Merci d’avance Cédric

        • elise Répondre

          Oops le code n’est pas entier :-/

          • 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)

  56. drabuziai vaikams Répondre

    Thanks a lot for an amazing post
    I’ll do that

  57. nico Répondre

    Bonjour,

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

    Merci

  58. jessica Répondre

    Bonjour
    Le code donner en comentaire ne marche pas pour la version 1.5.6

    merci

Laisser un commentaire

Votre adresse email ne sera pas publiée. Merci de saisir votre nom ou pseudo (pas de pseudo SEO merci !), votre email et votre commentaire.