Comment afficher une vidéo YouTube dans une fiche produit PrestaShop ?

Quoi de mieux pour présenter vos produits ou services que de pouvoir ajouter une vidéo sur vos fiches produits. Si votre boutique utilise la plateforme PrestaShop, vous avez sûrement constaté que cette fonction manque cruellement en natif. Certes il existe des modules mais je vais vous expliquer comment, sans module complémentaire, afficher une vidéo YouTube dans une fiche produit d’une boutique PrestaShop.

Comment ça marche ?

L’idée est de permettre au commerçant de pouvoir associer simplement une vidéo YouTube au produit qu’il est en train de gérer. Pour ce faire, nous allons exploiter un champ disponible sur la fiche produit : la référence fournisseur.

Pour afficher la vidéo dans le descriptif du produit, nous avons besoin de la référence de la vidéo. Par exemple, une vidéo située à cette adresse http://www.youtube.com/watch?v=BlvX9sHPjc4 a pour référence BlvX9sHPjc4

Ensuite, nous allons saisir la référence de la vidéo dans le champs référence fournisseur comme ceci :

Enregistrer la fiche produit et voilà que la vidéo s’affiche dans le descriptif du produit ou service :

 

Quelles modifications faire ?

Bon là on passe du coté du code informatique de votre thème graphique pour PrestaShop. Va falloir mettre un peu les mains dans le cambouis…
Dans les fichiers du thème graphique, éditer product.tpl qui permet l’affichage d’une fiche produit. A l’endroit ou vous souhaitez afficher la vidéo YouTube, insérer le code suivant :

supplier_reference correspond à la reference fournisseur mais vous pouvez utiliser tout autre element de la fiche produit.

Vous pouvez également personnaliser la taille de la vidéo affichée (width= »450″ height= »290″).

Et voilà vous pouvez maintenant afficher une vidéo YouTube dans la fiche produit d’une boutique en ligne PrestaShop

 

Remerciements

Je voudrais remercier Gabriel Crowe pour avoir partagé cette astuce. Vous pouvez consulter le billet original sur son blog : Embed a #youtube video in #prestashop.

Mon billet est une traduction libre de la méthode donnée par Gabriel.

16 Replies to “Comment afficher une vidéo YouTube dans une fiche produit PrestaShop ?”

  1. Mille merci Claude, votre astuce m’aide beaucoup à mieux présenter mes produits qui sont en vente.

    1. Bonjour mais votre site n’est pas motorisé avec PrestaShop.

  2. Superbe astuce, je viens de partager l’article sur Twitter! Nous avions la problématique avec une cliente.

  3. merci claude, c’est très exactement ce que je cherchais, je vais essayer ça tout de suite. 🙂

  4. Bonjour,

    je dirais « hummm oui… mais par contre on a plus la référence fournisseur… »

    me trompe-je ?

    Merci

    (ps: « regroupement de crédit » = contenu spinné pour un backlink en dofollow donc normal qu’il n’est pas un prestashop)

    1. Effectivement on a plus la référence fournisseur mais il est possible d’utiliser un autre champs non utilisé de la fiche produit.
      L’astuce est à adapter à con besoin…
      PS : c’est un peu le soucis du Dofollow : attirer des commentaires purement seo…

  5. bonjour, je n’arrive pas a faire fonctionner le script sur mon prestashop 1.4.5.1… comment cela se fait il alors que tout est bien en place product.tpl etc…

    1. Bonjour, je vous invite à suivre la discussion sur le forum Prestashop : http://www.prestashop.com/forums/topic/109517-tuto-video-youtube-dans-une-fiche-produit/

  6. Merci.. j’y suis déjà lol..:D

  7. Bonjour,
    auriez-vous une solution identique pour la version 1.3.1.1 ? car je n’arrive pas à afficher de vidéo youtube :/

    1. Bonjour,
      Cette solution fonctionne également pour toutes les versions de PrestaShop 1.3

  8. Bonjour
    J’ai essayé plein d’espoir votre bidouille. Hélas cela n’a pas marché. Par contre, en intégrant (en mode html) le code d’intégration Youtube tel qu’il est généré sur le site de chaque vidéo, ça marche nickel…
    C’est peut-être un peu plus long, mais c’est parfait !

    1. Bonjour,
      Quelle version de Prestashop utilisez-vous ?

  9. Bonsoir,
    une solution plus simple conciste a intégrer le lien de la vidéo dans le texte de la fiche produit et sa marche trés bien

  10. Bonjour,

    cela fonctionne mais, pas sur les tablettes(ipad etc)!!!

    merci

  11. J’ai fait autrement dans l’éditeur html tinymce cliquer sur le bouton « html » et ajouter le code complet de la video youtube, dailymotion ect…, et vous avez la video sur la fiche produit , vous pouvez faire la même méthode dans le petit descriptif en haut de la fiche produit la ou il y a le bouton « plus de d »étails » la video s’afficher aussi Sur PS 1.25 je sais pas si ça fonctionne pour les autre versions.

Laisser un commentaire