Avec WP Dark Mode vous pouvez utiliser une icône de commutation flottante unique pour basculer entre le mode clair et le mode sombre.
Insérez l'extrait HTML suivant dans votre page Web où vous souhaitez que l'interrupteur de mode obscur personnalisé apparaisse:
<div class="wp-dark-mode-switch"><div class="light">Se montrer sombre</div><div class="dark"> Montrer la lumière</div></div>
Vous pouvez personnaliser l'apparence et le comportement du commutateur en mode obscur en fonction de la conception et des exigences de votre site Web.
1. Commutateur en mode noir basé sur le texte: Avec le code suivant, vous pouvez afficher le texte «Mode léger» lorsque le site Web est en mode lumière et en mode «mode sombre» lorsque le site Web est en mode sombre.
<div class="wp-dark-mode-switch"><div class="light">Mode léger</div><div class="dark"> Mode sombre</div></div>
2. Interrupteur en mode noir basé sur l'image: Avec le code suivant, vous pouvez utiliser plusieurs images pour le commutateur en mode Dark en fonction de l'apparence de votre site Web (mode Dark / Mode Light).
<div class="wp-dark-mode-switch"><div class="light"><img src="light-mode-icon.png" alt="Mode léger"></div><div class="dark"><img src="dark-mode-icon.png" alt="Mode sombre"></div></div>
3. Commutateur en mode noir basé sur SVG: Avec le code suivant, vous pouvez plusieurs images SVG pour le commutateur en mode Dark en fonction de l'apparence de votre site Web (mode Dark / Mode Light).
<div class="wp-dark-mode-switch"><div class="light"><svg>...</svg><!-- SVG for light mode --></div><div class="dark"><svg> ...</svg><!-- SVG for dark mode --></div></div>
