Champs fiche produit PrestaShop

Comment ajouter un nouveau champ sur la fiche produit PrestaShop ? (ép. 143)

On a tous vécu un jour ce moment de frustration, le besoin d’ajouter un champ personnalisé sur PrestaShop pour des besoins bien spécifiques. Est-il encore possible aujourd’hui d’ajouter « simplement » un champ sur la fiche produit ?

Modifier la fiche produit PrestShop : il y a 11 ans en arrière

Hum, je viens tout juste de prendre peur… il me semblait que j’avais fait ce tutoriel d’ajout de champ sur la fiche produit, il n’y a pas si longtemps, mais en fait c’était genre 11 ans en arrière… et si je ne l’ai pas réactualisé depuis c’est qu’il y avait une bonne raison.

La méthode que j’avais proposée m’avait assez rebuté, parce qu’elle nécessitait la modification de beaucoup de fichiers et nécessitait aussi la création d’overrides. Vous me direz « Mais c’est logique si on veut faire bien… ! » C’est vrai, mais toute cette pile de code juste pour un seul champ ? Cela me semblait démesuré.

Depuis cette expérience, j’en étais resté au fait que pour des champs personnalisés, il était préférable d’acheter un module qui fait le travail où tout le développement a déjà été effectué en amont. Certes on achète le module, mais on obtient un gain de temps d’implémentation et plus de confort à l’utilisation…

Voici une nouvelle technique hybride pour ajouter des champs

Hier dans ma todolist, j’ai revu passer cette idée de billet… et je me suis posé la question si je pouvais contourner ces problèmes… Ne pas avoir besoin de faire d’override, ne pas avoir besoin de modifier la base de données, ne pas avoir besoin de toucher à 36’000 fichiers.

Et en prenant cette approche de manière assez amusante, je suis arrivé à une conclusion que je pouvais détourner toutes les règles habituelles en me servant d’un fichier externe CSV qui pourrait être piloté à la main, sans faire aucun changement dans des fichiers PHP tout en me limitant uniquement au template de Smarty.

Le concept est assez simple, lors du chargement d’une fiche produit, PrestaShop va lire le fichier CSV (via le TPL) et identifier les enregistrements associés et les afficher à l’écran. Avec cette approche le développement est ultra-court et vous savez le plus drôle dans tout ça ? C’est qu’en seulement 15 lignes de code la problématique est réglée.

Les avantages et les inconvénients de la méthode CSV

On va commencer par les avantages, ce qui est intéressant avec cette approche c’est que l’édition du contenu peut se faire directement dans Excel et être déléguée à n’importe qui. Vous pouvez aussi aller ultra-vite dans l’édition grâce à Excel, contrairement aux fiches produits qu’il faut éditer un à un.

Là où l’approche est moins bonne, c’est peut-être sur l’aspect sécurité, car les données sont stockées dans un CSV sur le FTP, mais il reste possible de sécuriser aussi le dossier par un .htaccess. Le fait aussi que PrestaShop doit lire tout le fichier pour trouver les enregistrements n’est pas forcément « super-optimal » il faudrait tester avec genre 100’000 lignes pour voir la vitesse de chargement de la page.

Il y a aussi le fait que le risque de faire « sauter » toutes les données est plus important, car si le fichier CSV est corrompu, c’est toutes les fiches produits qui sont impactées. Ce n’est pas le cas avec l’utilisation dune base de données où chaque enregistrement est stocké séparément à un emplacement précis.

Ajouter un champ est d’une facilité déconcertante

Ce qui est vraiment amusant avec ce mécanisme c’est qu’il n’a pas besoin de se poser beaucoup de questions. Pour ajouter un nouveau champ, il suffit de rajouter une colonne dans le fichier CSV et d’intégrer votre valeur. Ensuite dans le TPL la valeur est déjà prête à être exploitée.

En regardant un peu sur le web j’ai pu constater que d’autres personnes avaient déjà expérimenté de créer des « petit » sites e-commerce sans pour autant utiliser une base de données associée. C’est souvent une approche qui est délaissée actuellement, mais qui offre en réalité des raccourcis étonnants.

Ce que vous devez évaluer, c’est si cette approche peut réellement vous faire gagner du temps ou économiser de l’argent VS les inconvénients. Vous n’avez pas besoin de modules tiers, vous n’avez pas besoin de logiciel particulier, on est vraiment sur une couche technique très basique et simple d’accès.

Cette approche répond à une réelle demande des clients

Dans le cas présent, cela m’a quand même ouvert une nouvelle porte dans ma manière de penser… Vous savez, je vois très souvent des e-commerçants qui veulent modifier leurs fiches produits, effectuer de l’édition rapide de contenu, mais actuellement cela reste très contraignant et complexe.

Même si vous avez des outils que je vous recommande comme Store Commander ou Merlin Back-office, vous devez toujours passer par une étape de création de fichiers, l’importer dans la base de données, établir des correspondances… c’est une véritable organisation et mieux vaut être un bon procédurier, ce qui n’est pas le cas pour une partie des e-commerçants.

Beaucoup d’e-commerçants aimeraient piloter tout leur site e-commerce sur la base d’un fichier CSV / Excel intelligent et qui soit intuitif (sans pour autant demander une correspondance de 150 colonnes). C’est une piste de réflexion intéressante, mais certainement que PrestaShop est déjà trop gros pour aborder cette approche dans sa globalité.

Pour ce tutoriel PrestaShop vous avez à disposition :

  • 1 x product-add-to-cart.tpl (exemple de lecture du CSV)
  • 1 x customfields.csv (pour vos nouveaux champs)

Télécharger

Résumé de la vidéo : Intégrer de nouveaux champs sur la fiche produit PrestaShop, c’est facile !

  • On commence par créer un nouveau module PrestaShop, sans même créer de fichier PHP… Oui c’est étonnant, mais c’est tout à fait possible de procéder ainsi et de contourner les standards.
  • Ensuite, on va créer un fichier CSV avec les champs qu’on désire injecter sur la fiche produit, vous pouvez en créer de manière illimitée.
  • Concernant l’encodage du fichier CSV, je conseille de mettre l’encodage avec Notepad++ en mode UTF-8-BOM, sinon vous aurez des problèmes de lecture du fichier (notamment avec les accents).
  • Puis, sur le fichier TPL de la fiche produit, on affiche les valeurs des différents champs… Chaque variable est appelable par son numéro de colonne.
  • Vous pouvez déplacer cette brique de code de 15 lignes n’importe où dans votre fiche produit et ça fonctionne… c’est bien pratique.

3 commentaires sur “Comment ajouter un nouveau champ sur la fiche produit PrestaShop ? (ép. 143)”

  1. Hello Webbax,

    Merci pour ton tutoriel !
    En revanche de mon côté ça ne fonctionne pas je tombe en error 500 peu importe l’endroit ou le .tpl dans lequel je mets le code

    Est-ce que ça peut venir du {$urls.base_url}/modules/customfields/customfields.csv ?
    Y a-t-il quelque-chose à faire côté server ?

    Merci d’avance pour ta réponse !

  2. L’ideal serait de mettre un champ de texte sous la photo, car c’est là que se dirige le regard pour chercher des information lié a ce qui est présenté sur la photo. Mais là c’est une autre histoire..

Laisser un commentaire

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