Tout ce que vous voudriez savoir avant d'installer.
Un regard détaillé sur le fonctionnement de Module Dark Mode PrestaShop 8/9 — Mode sombre automatique, pourquoi nous l'avons conçu ainsi, et la réflexion derrière les fonctionnalités ci-dessus.
Le mode sombre est devenu un standard, pas une option
La majorité des smartphones et des ordinateurs sont configurés en thème sombre, au moins une partie de la journée. Un site qui reste blanc éclatant à 23 h sur un écran de téléphone provoque un inconfort visuel immédiat, et souvent une sortie. Ce module apporte à votre boutique PrestaShop le confort que vos clients trouvent déjà partout ailleurs, sans que vous ayez à retoucher une seule ligne de votre thème.
Il suit la préférence de vos visiteurs, tout seul
Par défaut, le module lit la préférence de couleur du système d'exploitation du visiteur et applique le mode correspondant. Si le client bascule son appareil en mode sombre pendant sa navigation, la boutique suit en direct, sans rechargement. Dès qu'il utilise le bouton pour choisir explicitement, son choix est mémorisé dans son navigateur et retenu pour toutes ses visites suivantes.
Un moteur universel qui respecte vos photos produit
Le moteur filtre intelligent inverse la page et contre-inverse chaque média : images, vidéos, iframes, canvas et arrière-plans. Vos photos produit conservent donc leurs couleurs naturelles, un t-shirt blanc reste blanc. Une protection anti double-inversion gère les médias imbriqués, cas fréquent sur les thèmes qui utilisent l'élément picture pour le responsive. Luminosité et contraste sont réglables pour affiner le rendu.
Ou une vraie palette sombre, générée pour vous
Le second moteur calcule une gamme sombre complète à partir de deux couleurs seulement : un fond et un accent. Trois niveaux de surface, les bordures, le texte principal et le texte atténué, l'accent et son état de survol en sont dérivés automatiquement, puis exposés en variables CSS. La couleur de texte des boutons est même choisie selon la luminance relative de votre accent, pour garantir un contraste lisible.
Zéro flash blanc, dès la première image
La plupart des solutions de mode sombre appliquent leur thème en JavaScript après le chargement, ce qui produit un éclair blanc désagréable. Ici, un script synchrone place la classe sombre dans la balise racine avant le premier rendu du navigateur. Le visiteur ne voit jamais la version claire, même une fraction de seconde.
Le bouton là où vous le voulez, sans coder
Bouton flottant discret dans l'un des quatre coins, ou switch intégré dans votre header ou votre footer. Vous choisissez le hook cible dans une liste, ou vous saisissez le nom d'un hook personnalisé de votre thème : le module l'enregistre automatiquement à l'enregistrement. Pour les intégrateurs, la syntaxe widget de PrestaShop permet aussi d'afficher le toggle n'importe où dans un modèle.
Léger, autonome, sans dépendance
Pas de Composer, pas de framework, aucune bibliothèque JavaScript externe. Environ 8 ko ajoutés au total, une API publique et un évènement de changement de mode pour brancher vos propres intégrations, et une prise en compte complète de l'accessibilité : attributs ARIA, focus visible et respect du réglage système de réduction des animations.
Il n’y a pas encore d’avis.