[FAQ] Comment afficher le titre complet des produits sur PrestaShop 1.7 et 1.6

Vous pourrez appliquer le concept sur n'importe quelle version de PrestaShop, ici je n'aborderais que les deux dernières à savoir la version 1.7 et la version 1.7 de PrestaShop.

Grâce à cette astuce vous pourrez afficher le titre de vos produits dans son intégralité, mais vous pourrez aussi moduler la longueur de ce titre si vous le souhaitez.

PrestaShop utilise le moteur de template Smarty pour l'affichage des données sur la partie Front de votre boutique, ici nous allons intervenir sur la fonction TRUNCATE de Smarty qui permet de n'afficher qu'un nombre limité de caractères.

Si vous souhaitez aller plus loin avec la fonction Truncate de Smarty, vous pouvez vous référer à la documentation officielle de Smarty.

PrestaShop 1.7

Accédez aux fichiers de votre template à l'aide de votre client FTP préféré et ouvrez le fichier themes > votre_theme > templates >  catalog > _partials > miniatures > product.tpl.

Rendez-vous vers la ligne 44 pour y trouver le code suivant :

  {block name='product_name'}
    {if $page.page_name == 'index'}
    	<h3 class="h3 product-title" itemprop="name"><a href="{$product.canonical_url}">{$product.name|truncate:30:'...'}</a></h3>
    {else}
    	<h2 class="h3 product-title" itemprop="name"><a href="{$product.canonical_url}">{$product.name|truncate:30:'...'}</a></h2>
    {/if}
  {/block}

Bien entendu, le numéro de la ligne est là à titre indicatif, votre template peut avoir ce code à une autre ligne que celle indiquée.

L'important est de repérer la titre auquel est appliqué la fonction Truncate.

ici cela se passe sur  

{$product.name|truncate:30:'...'}

Ainsi, pour afficher le titre de votre produit dans son intégralité il vous suffit de retrirer la fonction truncate en obtenant ce code :

{$product.name}

Ce qui va vous donner au final, ceci :

{block name='product_name'}
  {if $page.page_name == 'index'}
  	<h3 class="h3 product-title" itemprop="name"><a href="{$product.canonical_url}">{$product.name}</a></h3>
  {else}
  	<h2 class="h3 product-title" itemprop="name"><a href="{$product.canonical_url}">{$product.name}</a></h2>
  {/if}
 {/block}

PrestaShop 1.6

 Je ne vais pas tout reprendre comme pour la version 1.7, je vous invite donc à lire le paragraphe au dessus et de l'appliquer sur le code présent dans le fichier themes > votre_theme > product-list.tpl

 Vers la ligne 114 du fichier vous trouverez le code suivant :

<h5>
  {if isset($product.pack_quantity) && $product.pack_quantity}{$product.pack_quantity|intval|cat:' x '}{/if}
  <a class="product-name" href="{$product.link|escape:'html':'UTF-8'}" title="{$product.name|escape:'html':'UTF-8'}" itemprop="url" >
  {$product.name|truncate:45:'...'|escape:'html':'UTF-8'}
  </a>
 </h5>

à la différence de la 1.7, on doit conserver une fonction d'échappement des caractères et nous allons donc travailler sur le titre :

{$product.name|truncate:45:'...'|escape:'html':'UTF-8'}

 Que nous remplacerons par :

{$product.name|escape:'html':'UTF-8'}

Conclusion

La mise en oeuvre de cette astuce est très simple, mais n'oubliez pas de vous référer à la documentation officielle de Smarty pour comprendre l'usage de cette fonction Truncate, car peut-être trouverez-vous une configuration préférable pour votre usage.

Si après vos modifications, vous ne voyez aucun changement, n'oubliez pas de vider le cache de PrestaShop dans le menu Performances et tous les caches de votre navigateur.

Sur certains template, ce simple changement risque de provoquer des effets de bord avec le titre qui pourrait passer sur plusieurs lignes, donc effectuez vos tests sur une version de développement avant de mettre le bazar dans votre boutique.