Prestashop : comment mettre un script dans description produit ?

1. Prestashop : Activer les scripts dans l’éditeur de texte

Par défaut, l’éditeur de description dans PrestaShop (TinyMCE) bloque les balises <script> pour des raisons de sécurité. Cela empêche l’exécution de tout code JavaScript dans la description.

Pour contourner cela, il faut modifier la configuration de TinyMCE dans le fichier JavaScript correspondant au back-office, ou utiliser un plugin avancé. Cela autorise les scripts, mais nécessite de prendre des précautions de sécurité.

2. Prestashop : Intégrer le script directement dans le code source HTML

Dans l’onglet description, passe en mode HTML via l’éditeur (bouton "source" ou "<>"). Insère ton script JavaScript entre balises <script>...</script> à l’endroit voulu.

Cette méthode permet d’injecter du code interactif, comme des widgets, cartes, formulaires ou compteurs. Attention à ne pas altérer la mise en page ni compromettre la sécurité du site.

3. Prestashop : Utiliser un module HTML personnalisé

Si la description bloque les scripts, tu peux créer un module personnalisé ou utiliser un module du type "bloc HTML libre" pour insérer ton code script dans une zone personnalisée de la fiche produit.

Tu y places ton code JavaScript et choisis d’afficher ce contenu dynamique uniquement sur certaines pages. Cela permet un contrôle total du rendu sans modifier la description principale.

4. Prestashop : Ajouter le script via une balise iframe

Pour contourner les restrictions liées aux scripts JavaScript, insère ton script dans une page externe hébergée sur ton serveur, puis appelle-la via une balise <iframe> dans la description.

Cela permet d’afficher du contenu externe interactif sans injecter directement de script. C’est une méthode sûre pour insérer des widgets tiers (Google Maps, calendriers, vidéos interactives...).

5. Prestashop : Modifier le fichier .htaccess pour autoriser les scripts

Dans certains cas, le serveur peut bloquer l’exécution de scripts intégrés à cause des règles du fichier .htaccess ou des en-têtes HTTP.

Assure-toi que le site autorise le chargement de contenus dynamiques. Vérifie que les en-têtes de sécurité (Content-Security-Policy) ne bloquent pas les scripts inline. Cela évite les erreurs de chargement invisibles côté client.

6. Prestashop : Activer l’option HTML non filtré dans la base de données

PrestaShop filtre parfois automatiquement le contenu HTML lors de l’enregistrement. Le script est donc supprimé même si bien saisi dans l’éditeur.

Dans la table ps_configuration, active l’option PS_ALLOW_HTML_IFRAME ou vérifie si un filtrage de contenu est actif. Cette manipulation doit être faite avec précaution pour éviter toute faille XSS.

7. Prestashop : Ajouter le script avec un module tiers sécurisé

Certains modules PrestaShop permettent d’insérer du JavaScript personnalisé dans des zones spécifiques de la fiche produit, sans passer par la description.

Installe un module comme "Custom JS/HTML" et configure-le pour qu’il s’applique uniquement aux pages produits. Cela permet une injection contrôlée de code avec un bon niveau de sécurité et compatibilité.

8. Prestashop : Intégrer du script via les champs supplémentaires

Si tu ne veux pas toucher à la description, utilise les champs personnalisés (features ou tabs) de certains thèmes ou modules pour afficher du contenu enrichi.

Crée un champ spécifique dans la fiche produit, insère ton script ou ton iframe, et appelle ce champ dans le template. Cela te permet de mieux organiser ton contenu dynamique sans modifier le champ principal.

9. Prestashop : Sécuriser les scripts avec des conditions d’affichage

Si tu ajoutes un script dans une description, limite son chargement avec des conditions JavaScript ou des IDs spécifiques, afin qu’il ne s’exécute que sur certains produits.

Utilise des if ou des document.getElementById() pour cibler précisément l’exécution. Cela améliore les performances et limite les risques de conflits avec d’autres scripts du thème.

10. Prestashop : Tester l’impact sur le responsive et la performance

L’ajout d’un script dans la description produit peut impacter le responsive design ou ralentir le chargement. Il est essentiel de tester l’affichage sur mobile et desktop.

Analyse les performances avec Google PageSpeed Insights ou Lighthouse. Optimise ton script (chargement asynchrone, poids réduit) pour ne pas altérer l’expérience utilisateur ni le référencement SEO.