Comment activer le mode sombre sur votre site WordPress

Mettre ses utilisateurs à l'aise est l'objectif principal de tout site internet afin de les fidéliser. Il arrive que dans certaines conditions, on préfère avoir une luminosité adaptée, comme le mode sombre sur les smartphones lorsqu'il fait sombre. Mais comment activer le mode sombre sur un site WordPress pour améliorer l'expérience utilisateur? C'est ce que nous verrons à travers cet article.

Qu'est-ce que le mode sombre et pourquoi l'ajouter à votre site Web?

La plupart des appareils mobiles, Android ou iPhone, sont désormais équipés d'un mode Nuit. Ce dernier a des tons de couleurs plus chauds et convient à certains environnements. C'est un peu différent du mode sombre qui lui ajoute des couleurs sombres en arrière-plan. Le but ici est de réduire la quantité de lumière blanche de l'écran.

En utilisant une extension Google Chrome appelée Night Eye, il est possible de visualiser des sites Web en mode sombre. Nous l'avons testé sur notre site CodeWatchers et voici à quoi il ressemble:

Lorsque votre site dispose du mode sombre, cela donne à vos utilisateurs la possibilité de le désactiver ou de l'activer à leur guise lors de la navigation. Ceci est très pratique surtout lorsqu'il fait sombre pour une expérience de navigation plus confortable.

Plusieurs sites populaires proposent ce mode. C'est le cas par exemple de YouTube en cas de visionnage nocturne.

En outre, il est possible d'ajouter le mode sombre non seulement à l'interface de votre site Web, mais également à votre administrateur WordPress. Nous verrons en détail comment le faire plus tard. Mais commençons d'abord par activer simplement le mode sombre sur votre site Web.

Activation du mode sombre sur votre site Web WordPress

Pour commencer, vous devez installer et activer le Plug-in WP Dark Mode sur votre site WordPress. Ensuite, allez sur la page Paramètres »WP Dark Mode dans votre administrateur WordPress et cliquez sur l'onglet Paramètres généraux. Vous serez automatiquement redirigé.

À ce stade, vous verrez que le paramètre «Activer le mode sombre compatible avec le système d'exploitation» est activé. Fondamentalement, lorsque l'un des appareils de vos visiteurs est en mode sombre, la version en mode sombre de votre site Web leur sera affichée. Intéressant n'est-ce pas!

En outre, vous disposez également du paramètre «Afficher l'interrupteur flottant» qui permet à vos utilisateurs de basculer leur vue du site en mode sombre à tout moment, même s'ils n'ont pas activé l'option Mode sombre sur leur appareil. Ce paramètre apparaîtra également activé.

Revenez maintenant sur votre site Web. Dans le coin inférieur droit, il y a un interrupteur sur lequel vous n'avez qu'à cliquer pour basculer instantanément votre site en mode sombre sur votre appareil.

Dans l'onglet Paramètres de style, vous disposez d'une variété d'options qui vous permettront de personnaliser le mode sombre de votre site à votre guise.

REMARQUE: Il convient de noter que la version gratuite du plugin WP Dark Mode a des fonctionnalités limitées aux 2 premiers styles de commutateur flottant et aux 2 premiers préréglages de couleurs.

Avec la version Pro, vous avez beaucoup plus d'options de conception. De plus, il est possible d'activer le mode sombre à des moments précis ou d'ajouter du code CSS personnalisé.

Activation du mode sombre pour votre administrateur WordPress

Par défaut, WordPress n'a pas de jeux de couleurs d'administration pour réduire la lumière blanche provenant de votre écran. C'est pourquoi nous allons à nouveau utiliser le plugin WP Dark Mode. Heureusement, la procédure est très simple.

Allez simplement sur la page Paramètres »WP Dark Mode et cliquez sur l'onglet Paramètres généraux. Là, vous verrez le paramètre "Activer le Darkmode Backend". Vous passez sur ON et c'est fait. Bien entendu, n'oubliez pas de cliquer sur le bouton Enregistrer les paramètres en bas de la page:

Vous verrez maintenant un nouveau commutateur dans la barre supérieure de votre zone d'administration:

Pour basculer votre zone d'administration en mode sombre, cliquez simplement sur ce commutateur.

REMARQUE: même si vous avez plusieurs utilisateurs sur votre site WordPress, chacun d'entre eux peut choisir d'activer ou non le mode sombre comme il le souhaite.

De plus, il est possible d'utiliser le mode sombre avec un jeu de couleurs d'administration WordPress existant. Pour ce faire, allez dans Utilisateurs »Profil et cliquez sur une option sous l'option Schéma de couleurs de l'administrateur. Bien sûr, il est nécessaire de désactiver le mode sombre pour voir les options de jeu de couleurs de l'administrateur.

Lorsque vous écrivez un article dans l'éditeur de blocs WordPress, vous pouvez également activer le mode sombre. Pour ce faire, cliquez sur la petite icône colorée en haut à gauche, puis sélectionnez le mode que vous souhaitez utiliser.

C'est tout! Nous espérons que cet article vous aidera à ajouter facilement le mode sombre à votre site WordPress. Vous n'aurez donc pas à vous fatiguer les yeux lorsque vous travaillez tard le soir.

Si vous avez aimé cet article, partagez-le sur vos réseaux sociaux préférés. Nous vous recommandons également de nous suivre sur Twitter et Facebook pour être toujours au courant des prochaines publications.