Produits phares Prestashop

Prestashop 1.7 – Module Produits Phares (ép.12)

Les produits phares de Prestashop, ça reste un grand classique qui perdure depuis les toutes premières versions. Profitons d’ajuster quelques détails sur le module, afin de maximiser les chances de vendre.

Episode 12

La demande qui revient souvent des e-commerçants, c’est de pouvoir mettre un maximum de produits en page d’accueil et qu’ils puissent tourner automatiquement. Actuellement il possible de le faire avec le module, mais je déconseille cette stratégie « fainéante », car elle ne repose pas réellement sur une stratégie de vente.

Il faut que les produits montrés à l’accueil, répondent à une certaine logique, à une périodicité… à un segment de votre catalogue. Proposer un brassage trop large de produits n’est pas une bonne idée. Je conseille donc de faire une sélection précise de quelques produits et qui soit aussi cohérente avec le volume de votre stock… (si vous avez beaucoup de stock et que vous désirez liquider un peu les quantités).

Deux points viennent noircir le tableau, le fait que l’on ne peut pas désactiver le quick-view via le configurateur de thème (puisqu’il n’existe plus dans la version 1.7) et aussi le fait que la largeur des colonnes produits soit définie en pixels dans le thème. Pour les colonnes pourquoi ne pas avoir fait le choix d’un pourcentage dynamique pour la largeur ?

Ce module reste un pilier important de votre page d’accueil, il est donc important de ne pas négliger les détails, au niveau du nombre de produits ainsi qu’au niveau de l’intitulé du bloc. Vous devez donner envie à vos clients d’acheter, sans forcément proposer un « bazar » géant de votre catalogue.

Ressources

Pour ce tutoriel vous avez à disposition :

  • Fichier product.tpl (\themes\classic\templates\catalog\_partials\miniatures\product.tpl)
  • Fichier theme.css.txt (extrait des règles pour le fichier themes.css)

Télécharger

Au programme

  • But du module ? Dynamiser la page d’accueil.
  • Découverte la configuration du module (nombre de produits, catégorie master & affichage en aléatoire).
  • Utilisation du tri de position via les catégories.
  • Modifier le titre du module pour rendre plus vendeur.
  • Retirer l’option « quick-view », pour plus de lisibilité (moins de points d’entrées & moins de page à optimiser + ajuster le fichier CSS).
  • Constatation du système de grille largeur fixe en pixels (mauvaise idée).

13 réflexions au sujet de « Prestashop 1.7 – Module Produits Phares (ép.12) »

  1. Bonjour,
    un petit souci sur 1.7 : en pleine page les produits phares sont 4 par ligne. Avec une colonne latérale ils ne sont plus que 2 et désaxés. Comment en avoir 3 sur la largeur de la colonne principale svp ?
    Merci

    1. Bonjour,

      Pour cela il faudrait ajuster les règles CSS, mais je ne pourrais pas donner ici l’exemple exact pour obtenir ce résultat. Vous pouvez toujours vous faire aider par un intégrateur CSS.

      Merci pour votre visite.

  2. Bonjour,

    Par mégarde j’ai modifier le fichier product.tpl du dossier « partials » mais pas « miniatures » en appliquant le même code que celui du dossier « miniatures », du coup j’ai un problème d’affichage de mes produits depuis le menu par exemple. J’aimerais savoir comment récupérer le code d’origine du fichier product.tpl du dossier « partials » et non « miniatures »?

  3. Bonjour,
    Vidéo intéressante sur beaucoup de points.
    Cependant, concernant la fonction quickView, même si celle-ci paraît inutile et demande de renseigner du texte dans la short_description, je trouve que la supprimer d’un point de vue graphique n’est pas top, même en arrangeant le CSS.
    Pourquoi ne pas simplement remplacer $product.description_short…. par {$product.description ….dans quickview.tpl?
    Je pense que l’accès à l’info de cette manière évite de devoir cliquer sur le produit pour obtenir la description complète et perdre le bénéfice des produits présents sur la home.

    1. Hello,

      Effectivement peut-être que la suppression du « quick view » n’est pas indispensable. Disons que je n’aime pas trop cette fonction, car elle génère un popup de présentation de la fiche qui diffère légèrement de la page de produit classique (et donc cela fait 2 templates de pages produits à optimiser popup et non-popup).

      Sinon je n’ai pas vraiment d’explication à cela, il est bien sûr possible de faire autrement… Disons que je fais ces tutos en improvisation assez « rapidement »… et je pense qu’il est possible de faire mieux, mais c’est déjà une base d’optimisation.

      A bientôt et merci pour ta proposition !

      1. .Oui …c’était juste une idée comme ca.
        Merci en tout cas pour ces tutos qui aident bien (moi le premier) à la prise en main des différence de ce Presta 1.7 avec le 1.6
        Cdlt

  4. Bonjour,
    Les modifications faites du CSS, que ce soit pour le quick view ou autre, vont être effacées à la première mise à jour du thème, ou de Prestashop.
    N’y a t-il pas un moyen de modifier le CSS durablement même en cas de mise à jour du thème, genre module CSS additionnel comme on le voit dans des thèmes WordPress par exemple ?

    1. Bonjour,

      Dans le dossier du thème, il y’a un fichier « custom.css » vous pouvez mettre les règles CSS dans ce fichier. Sinon vous pouvez aussi faire une copie du thème de manière à avoir un thème personnalisé qui ne soit pas impacté par les mises à jour de Prestashop.

      Merci pour votre visite !

      1. Merci à vous pour vos conseils et votre vidéo.
        J’ai effectivement créé un thème enfant de Classic. Mais je ne sais pas où mettre les CSS. Ce que je souhaite c’est garder mes modifications de thème, et faire les mises à jour de Prestashop.

        1. Bonjour,

          Actuellement je n’ai pas vraiment expérimenté les thèmes enfants dans Prestashop 1.7. Comme ça je dirais… peut-être « dupliquer » le thème pour que le dossier « copie » soit jamais impacté par les changements.

          Il faudra que je teste à l’occasion…

          A bientôt !

Laisser un commentaire

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