Prestashop 1.6 couplé à Smarty permet d’améliorer grandement et d’automatiser le SEO de son e-commerce, ce en quelques lignes de code à peine. Il est ainsi possible d’automatiser les balises title et description, les balises Open Graph pour Facebook, mais dans le cas d’un Prestashop multilingue, Google suggère l’utilisation d’une balise meta nommée hreflang.
Voyons en détail ce qu’est une balise hreflang, puis comment l’implémenter aisément dans notre thème Prestashop 1.6.
1/ La balise hreflang
Dans le cadre d’un site en plusieurs langues, deux solutions sont envisageables :
- posséder le même site avec une extension de domaine correspondant à un pays spécifique (comme avoir https://www.monsite.fr et parallèlement https://www.mysite.co.uk)
- posséder un seul site internet mais avec dans l’URL un paramètre de langue, ce qui donnerait https://www.monsite.fr/fr/ et https://www.monsite.fr/en/
L’avantage de posséder une extension de domaine permet un meilleur positionnement aux niveaux des moteurs de recherche selon le pays, mais le coût en hébergement peut se retrouver nettement plus considérable (et cela sous-entend bien évidemment une conception SEO irréprochable, par site, selon la langue)
En revanche, les paramètres de langue ne permettent pas un référencement équivalent à la première solution, malgré un coût pour le e-commerçant bien amoindri. Heureusement, la balise hreflang optimise le crawl des moteurs de recherche afin d’optimiser cela.
La balise hreflang est une indication fournie aux moteurs de recherche précisant une version d’une page internet dans une langue différente que celle affichée.
Ainsi, si notre page est en /fr/, nous indiquerons toutes les autres langues, aidant de la sorte les moteurs à bien enregistrer et mettre en avant notre contenu multilingue.
Cette balise n’est donc utile que dans un contexte international. Plus loin encore, sachez que les codes langues sur internet précisent le pays. Vous aurez ainsi peut-être croisé (comme Team Ever le constate régulièrement) des codes langues comme en-us, en-uk (qui spécifient une langue commune mais parlée dans des pays différents).
Il s’agit là d’une information optionnelle, mais non négligeable, à passer dans l’en-tête HTTP de son site. Il est à noter que le HTTPS impacte ces informations (et voyez ici comment correctement passer votre site Prestashop sous un certificat SSL).
Donc, comment automatiser ces balises, dans l’idée où vous pourriez ajouter dans le temps davantage de langues, et de manière à ne pas renseigner manuellement l’information hreflang ?
2/ Automatiser le hreflang sur Prestashop
Afin de mettre en place une telle balise, il est important de bien définir sur quelle page l’on se trouve. Le code ne prend pas en compte les modules mettant en avant des pages spécifiques, comme un blog, ou comme toute page étant générée depuis un module.
La variable Smarty de Prestashop $page_name nous permet d’emblée de définir sur quel template nous nous trouvons (un produit, une catégorie, la page d’accueil…)
Il nous faut plusieurs informations :
- La page affichée (produit, etc)
- Le code langue
- Les paramètres passés dans l’URL (tout ce qui suit le nom de domaine suivi du code langue)
Smarty sous Prestashop 1.6 nous permet donc, grâce à $link, de récupérer un lien précis.
Le code, à placer parmi les meta dans le header.tpl (mais surtout pas dans une boucle foreach) est par conséquent celui-ci :
<!-- add balise hreflang -->
{if $page_name == 'category'}
{foreach $languages as $lang}
{if $lang_iso != $lang.iso_code}
<link rel="alternate" hreflang="{$lang.language_code}" href="{$link->getCategoryLink($smarty.get.id_category, null, $lang.id_lang,null,null )}/" />
{/if}
{/foreach}
{/if}
{if $page_name == 'product'}
{foreach $languages as $lang}
{if $lang_iso != $lang.iso_code}
<link rel="alternate" hreflang="{$lang.language_code}" href="{$link->getProductLink($smarty.get.id_product, null, null, null, $lang.id_lang, null, 0, false)}/" />
{/if}
{/foreach}
{/if}
{if $page_name == 'cms'}
{foreach $languages as $lang}
{if $lang_iso != $lang.iso_code}
<link rel="alternate" hreflang="{$lang.language_code}" href="{$link->getCMSLink($smarty.get.id_cms, null, false, $lang.id_lang)}/" />
{/if}
{/foreach}
{/if}
{if $page_name == 'manufacturer'}
{foreach $languages as $lang}
{if $lang_iso != $lang.iso_code}
<link rel="alternate" hreflang="{$lang.language_code}" href="{$link->getManufacturerLink($smarty.get.id_manufacturer, null, $lang.id_lang , null)}/" />
{/if}
{/foreach}
{/if}
{if $page_name == 'index'}
{foreach $languages as $lang}
{if $lang_iso != $lang.iso_code}
<link rel="alternate" hreflang="{$lang.language_code}" href="/{$lang.iso_code}/"/>
{/if}
{/foreach}
{/if}
Notez que systématiquement le foreach nous permet de lister toutes les langues disponibles sur le site. En outre, la condition if nous permet de tester directement la page affichée.
Le résultat ?
Bluffant ! A vous d’essayer !
Si vous utilisez Prestashop 1.7, plus la peine de vous embêter, un module gratuit est disponible ici :