Tout ce que vous voudriez savoir avant d'installer.
Un regard détaillé sur le fonctionnement de Module Slider Page d'Accueil PrestaShop 8/9 : Bannières Rapides WebP, pourquoi nous l'avons conçu ainsi, et la réflexion derrière les fonctionnalités ci-dessus.
Une grille de hero, pas un simple carrousel
Les modules de slider classiques affichent une image après l'autre et s'arrêtent là. Celui-ci reproduit la structure d'accueil des grands sites e-commerce : un slider principal qui occupe les trois quarts de la largeur, deux bannières empilées à sa droite (catalogue, livraison, service) et deux bannières promotionnelles larges en dessous (marques, offres du moment). Sur mobile, la grille s'empile proprement en une colonne. Chaque zone se remplit depuis le même onglet du back-office, avec un aperçu des images en place et leurs dimensions.
Construit pour les Core Web Vitals
Un slider est presque toujours l'élément LCP d'une page d'accueil, et c'est là que la plupart des modules échouent. Ici, chaque image est redimensionnée à la largeur maximale de sa zone et convertie en WebP dès l'upload. La première slide est annoncée au navigateur par une balise link rel preload avec fetchpriority high, placée dans le head : elle se charge avant même que le CSS soit interprété. Toutes les autres images sont en lazy loading avec decoding async, et les attributs width et height stockés en base suppriment tout décalage de mise en page. Le JavaScript du slider pèse environ 3 Ko, en vanilla, chargé en defer, sans aucune librairie.
Planifiez vos campagnes, le module s'occupe du reste
Chaque bannière accepte une date de début et une date de fin, à la journée ou à l'heure près. Votre opération de Noël se prépare en novembre, se publie le 1er décembre à minuit et disparaît le 26 au matin, sans que personne ne se connecte au back-office. Le cache du module se régénère automatiquement pour suivre le calendrier, et toute sauvegarde en back-office le vide instantanément.
Le mobile traité comme un vrai canal, pas comme une réduction d'écran
Un visuel panoramique de 1400 pixels est illisible réduit sur un écran de téléphone. Chaque slide accepte donc une image mobile dédiée, cadrée pour le format portrait, servie sous 768 px via la balise picture. Le préchargement suit : deux balises preload avec attributs media, chaque appareil ne télécharge que sa variante. Et si une zone n'a pas de sens sur mobile, un interrupteur dans la configuration la coupe entièrement : les images passent alors en lazy et ne sont jamais demandées par le navigateur. Ce sont des kilo-octets réellement économisés, pas simplement masqués.
Propre côté serveur aussi
Le rendu du hero est mis en cache Smarty par langue et par boutique : en régime de croisière, afficher les cinq zones ne coûte aucune requête SQL. Quand le cache se régénère, une seule requête groupée récupère toutes les bannières. Le CSS et le JS ne sont enregistrés que sur le contrôleur d'accueil, le reste de la boutique n'en charge pas un octet. Le module respecte les standards PrestaShop : ObjectModel, contrôleur d'administration dédié, multiboutique et multilingue natifs, désinstallation propre.
Il n’y a pas encore d’avis.