Aller au contenu principal

Activation du Module de Manipulation Swiper

Si vous utilisez le module Product Video de Smart Modules dans un thème PrestaShop qui utilise Swiper Slider, vous pourriez rencontrer un problème où la miniature vidéo ne s'affiche pas aux côtés de vos images de produit.

Cela se produit généralement lorsque le module Manipulation de Swiper n'a pas été activé. Le module est essentiel pour permettre l'insertion d'éléments dynamiques (comme les diapositives vidéo) dans le slider au moment de l'exécution.

🧠 Quand Avez-vous Besoin de Ceci ?​

Vous pourriez voir une erreur comme celle-ci dans la console de votre navigateur :

danger

Uncaught TypeError: slider.addSlide is not a function

Pourquoi cela se produit

Cette erreur signifie que le slider Swiper de votre thème n'est pas initialisé avec le module Manipulation, qui est requis par le module Product Video pour ajouter dynamiquement des miniatures vidéo comme diapositives.

La bonne nouvelle ? Corriger cela ne nécessite qu'une petite modification dans le code d'initialisation de Swiper de votre thème.

🛠️ Étape par Étape : Comment Activer le Module de Manipulation​

1. Localiser le Code d'Initialisation de Swiper​

Dans les fichiers de votre thème, localisez le fichier JavaScript qui initialise le slider d'images de produit. Il se trouve généralement dans :

/themes/votre-theme/assets/js/product.js
/themes/votre-theme/js/product.js
/themes/votre-theme/js/custom.js

Recherchez une configuration Swiper comme celle-ci :

var swiper = new Swiper('.swiper-container', {
  // vos options Swiper
});

2. Ajouter le Module Manipulation​

Dans la configuration Swiper, trouvez la propriété modules. Ajoutez Manipulation à la liste.

Exemple avant :

modules: [Navigation, Pagination],

Mise à jour vers :

modules: [Navigation, Pagination, Manipulation],

Si la propriété modules n'existe pas encore, ajoutez-la comme ceci :

modules: [Manipulation],
Conservez les modules existants

Ne supprimez aucun module existant — ajoutez simplement Manipulation à la liste.

3. Vider le Cache de PrestaShop​

Après avoir enregistré vos modifications :

  1. Allez dans votre Back Office
  2. Naviguez vers Paramètres Avancés > Performances
  3. Cliquez sur Vider le Cache

Cela garantit que votre JavaScript mis à jour est chargé correctement.

4. Tester le Résultat​

Rechargez n'importe quelle page de produit avec une vidéo attachée. Si tout est correct, la miniature vidéo apparaîtra maintenant dans la galerie d'images du produit, entièrement intégrée dans le slider Swiper.

📚 Liens Associés​

💬 Besoin d'Aide ?​

Si vous n'êtes pas sûr de l'emplacement de ce code ou de la manière de le modifier, n'hésitez pas à contacter notre équipe de support. Vous pouvez également nous envoyer le fichier où Swiper est initialisé, et nous vous guiderons volontiers à travers la modification.

En suivant ces étapes, vous assurerez une compatibilité totale entre le slider Swiper de votre thème et le module Product Video de Smart Modules, en maintenant vos miniatures vidéo fonctionnelles et en évitant toute erreur JavaScript.