Regarde le tuto complet directement ici ⬇️
Introduction
Dans ce tutoriel, vous apprenez à configurer le module carrousel PrestaShop tel qu’attendu à l’épreuve E5B : accès au Gestionnaire de modules, activation/désactivation, réglages (vitesse, pause au survol, boucle), puis édition des diapositives (image, titre, URL, légende, description) et ajout d’une nouvelle slide. Le déroulé suit fidèlement la vidéo : vous pourrez reproduire chaque clic, valider l’affichage en front et documenter vos choix pour l’évaluateur. Objectif : un carrousel propre, utile et cliquable qui oriente efficacement les visiteurs.
Étape 1 — Ouvrir le module Carrousel
Repérez et ouvrez le module depuis le back-office.
- Aller dans Modules → Gestionnaire de modules.
- Rechercher “carrousel”.
- Cliquer sur le module Carrousel pour afficher ses actions.
Étape 2 — Activer/Désactiver le carrousel
Gérez son affichage en un clic.
- Cliquer sur la flèche d’actions.
- Désactiver (confirmation), puis Activer si besoin.
- Vérifier visuellement le statut du module.
Étape 3 — Accéder aux réglages du carrousel
Ouvrez la page de configuration.
- Via la flèche d’actions, cliquer sur Configurer.
- Contrôler que vous êtes bien sur la page Paramètres du carrousel.
Étape 4 — Régler la vitesse, la pause et la boucle
Ajustez le comportement du slider.
- Vitesse de transition : modifier (ex. 5000 ms → 10000 ms si demandé).
- Pause au survol : activer/désactiver (le slider s’arrête au passage de la souris).
- Répétition des images : choisir boucle infinie ou stop à la dernière.
Étape 5 — Modifier une diapositive existante
Mettez à jour l’image et ses informations.
- Dans Liste des diapositives, cliquer sur Modifier.
- Remplacer l’image (fichier depuis l’ordinateur).
- Renseigner Titre (ex. Catégorie Art).
- URL cible :
- Ouvrir la boutique, aller sur la catégorie Art, copier l’URL.
- Coller l’URL dans le champ prévu.
- Ajouter Légende et Description.
- S’assurer que la diapo est activée, puis Enregistrer.
Étape 6 — Ajouter une nouvelle diapositive
Enrichissez le carrousel avec un nouveau visuel.
- Cliquer sur le + (ajouter un élément).
- Sélectionner l’image.
- Saisir Titre, URL, Légende, Description.
- Activer la diapo et Enregistrer.
📌 Conseils pour l’examen
- Préparez des images optimisées (poids raisonnable, format homogène).
- Utilisez des titres clairs et des URLs internes cohérentes (catégories, promos).
- Testez pause au survol et boucle pour une UX fluide.
- Faites des captures (réglages + front) pour votre dossier E5B.
⚠️ Erreurs à éviter
- Oublier d’activer le module ou la diapo.
- Coller une mauvaise URL (page inexistante, langue/ID erronée).
- Mettre une vitesse trop rapide (lecture inconfortable).
- Enregistrer l’image sans enregistrer la page complète de config.
✅ Checklist révision rapide
- Module trouvé via Modules → Gestionnaire
- Activation vérifiée
- Vitesse, pause, boucle réglées
- Diapo modifiée (image + titres + URL)
- Nouvelle diapo ajoutée et active
- Vérification front OK
FAQ : Tout savoir sur le carrousel d’accueil
Quelle vitesse de transition choisir pour un bon confort de lecture ?
Entre 5 et 8 secondes convient à la plupart des slides. Pour de longs textes, augmentez légèrement. L’objectif est de laisser le temps de lire sans ralentir l’exploration.
Faut-il activer la pause au survol ?
C’est recommandé : l’utilisateur peut s’arrêter sur une offre. Activez-la surtout si vos slides contiennent du texte ou des CTA nécessitant quelques secondes d’attention.
Comment lier chaque diapo à une page pertinente ?
Utilisez des URLs internes : catégorie phare, landing promo, meilleur produit. Ouvrez la page en front, copiez l’URL, puis collez-la dans la diapo. Vérifiez le clic en front.
Puis-je mélanger images branding et offres ?
Oui, mais gardez une cohérence visuelle (même gabarit, palette). Placez en première diapo votre message prioritaire (nouvelle collection, offre majeure).
Le carrousel ralentit-il la page ?
Des images lourdes peuvent impacter la vitesse. Compressez vos visuels, évitez les fichiers géants et limitez le nombre de slides à l’essentiel (3–5).
Comment prouver mes réglages à l’évaluateur E5B ?
Ajoutez : capture de la page de configuration, capture du carrousel en front, et une brève note expliquant vos choix (vitesse, pause, liens).
📚 Envie d’aller plus loin ? Découvrez notre Formation Prestashop BTS NDRC 2025 pour maîtriser toutes les compétences de l’épreuve !
🎥 Retrouvez tous nos tutos en vidéo sur la playlist YouTube dédiée !