brand-lws-red brand-lws-white
Tutoriels

WordPress
time_read24mn de lecture

Comment activer le mode sombre dans WordPress ?

10 septembre 2022

Comment activer le mode sombre dans WordPress ?

La navigation en mode sombre est devenue une pratique de plus en plus utilisée sur internet. Par exemple, les plus grands réseaux sociaux, notamment Facebook, Twitter et Instagram, offrent désormais le mode sombre à leurs utilisateurs🔎. De même, les systèmes d’exploitation tels que Windows, macOS et les plateformes Android ont également suivi le pas. La plupart d’internautes utilisent préférentiellement un tel mode la nuit, dans le but de réduire la fatigue oculaire.🤗

Si votre site est basé sur WordPress, l’ajout d’un mode sombre est très simple et ne nécessite pas d’appliquer du code. 😎

Objectif

Ce tutoriel donne des détails sur la façon d’activer le mode sombre sur un site WordPress. Le processus ne prend que quelques minutes. En lisant cet article jusqu’à la fin, l’ajout d’un mode sombre à votre site ne sera jamais difficile.😇

Prérequis

Pourquoi activer le mode sombre dans WordPress ?

activer le mode sombre dans WordPressSur internet, le mode sombre consiste à changer l’arrière-plan de l’interface web en couleur sombre dont la teinte peut varier en fonction d’une certaine configuration. La plupart de navigateurs web modernes sont équipés d’une fonctionnalité permettant aux internautes d’adopter le mode sombre lorsqu’ils naviguent la nuit. Mais les étapes à suivre varient énormément et peuvent même nécessiter quelques compétences techniques.

En ajoutant le mode sombre à votre site, vous pouvez simplifier ce processus. Vos lecteurs peuvent ainsi basculer en un clic dans le mode sombre le soir et le désactiver quand ils visitent votre site le jour.

Le mode sombre présente quelques avantages, notamment :

  • Réduction de l’intensité de la lumière blanche : en fait, la lumière blanche est surtout connue pour entraîner la fatigue visuelle lorsque l’internaute navigue la nuit.
  • Augmentation de la durée de vie des batteries des appareils : le mode sombre est également connu pour réduire la consommation de l’énergie. Ce qui augmente l’autonomie de batteries pour les téléphones mobiles, les tablettes et les ordinateurs.
  • Augmentation de l’acuité visuelle : Il a été aussi démontré que le mode sombre exerce moins de pressions sur les yeux la nuit. En effet, sous un arrière-plan sombre, certains textes sont mieux lisibles et donc ne nécessitent aucun effort supplémentaire des yeux. Ce qui peut occasionnellement augmenter le temps passé à lire votre contenu.
  • Une préférence pour certains internautes : parfois lire en mode sombre est une simple question de préférence. Certains internautes se concentrent mieux lorsque l’arrière-plan de l’interface web est sombre. Et ce n’est pas toujours le cas pour les autres. Dans tous les cas, disposer de deux modes (mode sombre et mode light) est avantageux.

Comment ajouter le mode sombre à votre site WordPress ?

ajouter lemode sombre à WordPressAjouter un mode sombre à un site WordPress est incroyablement simple. Vous devez noter que la manière la plus facile de procéder consiste à utiliser un plugin, bien qu’il existe certains thèmes WordPress spécifiques qui peuvent vous aider à activer le mode sombre. Sur le catalogue de plugins de WordPress, il existe quelques extensions pour vous lancer.

Parmi les solutions prêtes à l’emploi, vous avez entre autres :

  • WP Dark Mode : ce plugin semble être le plus populaire de la catégorie. Il offre des nombreuses fonctionnalités pour activer le mode sombre sur différentes sections de votre site WordPress.
  • Droit Dake Mode : il s’agit d’une alternative de choix à l’extension WP Dark Mode. Il est compatible avec Gutenberg, Elementor et la majorité de thèmes WordPress.
  • Go Nigth Pro : cette extension premium contient des nombreuses fonctionnalités pour activer le mode sombre sur votre site en quelques minutes.

Activer le mode sombre dans WordPress avec le plugin WP Dark Mode

Nous allons utiliser le plugin WP Dark Mode pour vous aider à activer le mode sombre sur votre site WordPress. Vous devez noter qu’il s’agit d’un plugin freemium. Vous pouvez donc l’installer depuis le référentiel de WordPress.

Pour ce faire, connectez-vous à l’espace d’administration de votre site. Ensuite, rendez-vous dans la section « Extensions › ajouter ».Extensions/ajouter Dans le répertoire de plugins WordPress, utilisez la zone de rechercher pour trouver le plugin WP Dark Mode rapidement. Cliquez ensuite sur le bouton « Installer maintenant ».installer WP Dark Mode Lorsque le plugin est installé sur votre site, vous pouvez passer ensuite à la configuration. Vous devez noter que le plugin WP Dark Mode permet d’activer le mode sombre sur l’interface publique de votre site, dans l’espace d’administration et dans l’éditeur Gutenberg.

1. Activer le mode sombre sur l’interface publique de votre site

Rendez-vous dans la section « WP Dark Mode › Settings ».WP Dark Mode/Setting Dans l’interface suivante, accédez à la section « General settings ». Vous devez activer l’option « Enable frontend darkmode ». Vous pouvez également activer l’option « Enable OS aware dark mode ». Cette option bascule automatiquement l’interface en mode sombre pour les visiteurs ayant activé le mode sombre dans les préférences de leurs appareils.

Une fois que vous avez terminé, enregistrez vos modifications.General setting Ensuite, vous pouvez accéder à la section « Advanced settings » où vous pouvez choisir le mode sombre comme mode par défaut pour votre site. Vous pouvez également activer d’autres options selon vos souhaits.Advanced settingsPar la suite, vous pouvez accéder à la section « Color settings » pour ajuster les paramètres d’affichage du mode sombre.paramètres de couleurs

Dans la même section, vous pouvez aussi adopter une configuration personnalisée pour l’arrière-plan de votre site, les textes et les liens.

Si vous souhaitez gagner du temps dans la configuration de la palette de couleurs, vous pouvez utiliser des modèles prédéfinis en activant l’option « Want to use color presets ».activer les modèles de mode sombre Une fois que l’option est activée, il ne vous reste qu’à choisir un modèle parmi ceux proposés.choisir un modèle à appliquer au mode sombre

En accédant à la section « Switch settings », vous pouvez choisir un style de la bascule que les visiteurs utiliseront pour passer d’un mode à l’autre.choisir le style de la bascule

Sur la même interface, vous pouvez modifier les dimensions de votre bouton de bascule ou lui ajouter des animations.personnaliser la basculeUne fois que vous avez terminé, enregistrez vos modifications. Et voilà, vos visiteurs peuvent désormais passer instantanément d’un mode à l’autre à l’aide de la bascule.bascule de mode sombreEn cliquant sur le bouton de bascule, le mode sombre s’active.mode sombre

En outre, le plugin WP Dark Mode vous donne également la possibilité de configurer le mode sombre avec votre boutique WooCommerce.activer le mode sombre pour WooCommerce

2. Configurer un mode sombre pour l’espace d’administration

Accédez à la section « General settings » et activez l’option « Enable backend darkmode ».activer le mode sombre dans l'espace d'administration Enregistrez vos modifications et c’est tout. Une bascule sera affichée sur la barre supérieure de votre tableau de bord permettant de passer d’un mode à l’autre.bascule de mode sombre/tableau de bord WordPressAprès activation du mode sombre dans le tableau de bord, vous pouvez aussi ajuster le jeu de couleurs pour les différents blocs dans la section « Profil ».modifier le jeu de couleurs

3. Activer le mode sombre dans l’éditeur Gutenberg

Rendez-vous dans la section « General settings » et activez l’option « Enable block editor dark mode ».activer le mode sombre dans l'éditeur Gutenberg Enregistrez vos modifications et un menu déroulant s’ajoute à la barre supérieure de Gutenberg permettant de charger rapidement de mode.menu deroulant pour activer le mode sombreEn déroulant le menu, vous pouvez activer ou désactiver le mode sombre.activer le mode sombre/éditeur Gutenberg

En activant le mode sombre, voici à quoi ressemble l’interface d’édition de Gutenberg.👇éditeur Gutenberg en mode sombre

Conclusion

🥳Toutes nos félicitations d’avoir lu cet article. Comme vous avez pu le voir, activer le mode sombre dans WordPress n’était pas compliqué. Cet article vous a appris la façon de procéder pour activer le mode sombre dans les différentes sections de votre site. Vous avez maintenant toutes les connaissances, lancez-vous dès aujourd’hui avec LWS !

Une solution clés en main pour créer un site WordPress ?

LWS vous conseille sa formule d’hébergement WordPress en promotion à -20% (offre à partir de 3,99€ par mois au lieu de 4,99 €). Non seulement les performances sont au rendez-vous mais vous profitez en plus d’un support exceptionnel.

Découvrir l'offre

Si vous avez des questions, utilisez la section commentaires pour nous écrire.

Avatar de l'auteur

Auteur de l'article

Joseph

Joseph est rédacteur web depuis quatre ans. Ses thématiques préférées sont le digital et le web marketing et l’e-commerce. La persévérance, l’assiduité et le courage font partie de sa méthode de travail. C'est ce qui lui permet d'affronter n’importe quel sujet.

Avis client de l'hébergeur LWS

Nos avis Trustpilot Nos avis Hostadvice Nos avis sur avis.lws.fr
Avis trustpilot 30/04/2022

LWS l'hébergeur par excellence !

LWS est pour moi l'hébergeur par excellence, que cela soit au niveau de l'hébergement qui est très performant, les mails qui sont d'une qualité professionnelle et de la gestion du domaine facile à comprendre.

PauseGreen

Avis hostadvice 27/04/2022

Super, au top !

Au top, prix attractif. Service très rapide et réactif. Je l'ai même personnellement recommandé à des proches. La vie est bien plus facile avec LWS

Masset Eliot

Avis avislws 26/04/2022

Support

Clair, efficace, rapide et à tarif abordable. J'ai maintenant un site superbe à mon image, puisque je le fais moi-même. L'équipe technique est au top, j'ai une réponse en 20 minutes, cela change d'autres hébergeurs pourtant plus connu.

Lady Whip

Avis hostadvice 24/04/2022

Bravo et merci

Bravo et merci aux équipes techniques pour leur réactivité et leur professionnalisme depuis plus de 10 ans chez eux et de nombreux sites !!! Merci

Olivier Delmas

Avis trustpilot 23/04/2022

Je suis très satisfait.

J'ai commandé un hébergement pour le site d'une association. Tout s'est passé très rapidement et sans la moindre embuche. La tarification est attractive et me parait très claire. Le panneau d'administration de l'hébergement est facile à utiliser et à comprendre. Je n'ai pas encore installé Wordpress car le contenu n'est pas prêt mais ce sera la prochaine étape et je suis très confiant. Merci !

Pierre-André Liné

Avis avislws 20/04/2022

Un service technique excellent

Je suis client chez LWS depuis 2011 avec une boutique OSCommerce qui tourne comme une horloge depuis cette date sur un hébergement mutualisé. La disponibilité de la boutique est très proche de 100%. Concernant les rares problèmes rencontrés en huit ans, j’ai eu à chaque fois un technicien compétent qui a résolu le problème très rapidement et efficacement. Je suis en train de migrer sur une plateforme Pretashop sur un VPS, avec l’offre LWS Debian 9 et Prestashop. Un technicien m’a grandement aidé pour finaliser l’installation de la boutique lors de la mise à jour vers la dernière version de Prestashop 1.7 qui posait problème. Je suis très satisfait de LWS, et ce sur la durée : réponses et réactions rapides et efficaces. Je recommande cet hébergeur et encore merci.

Alain

Avis trustpilot 16/04/2022

Une expérience jamais égalée !

Étant Développeur Web & Mobile Full-Stack depuis plus de 5 ans déjà, j'ai rarement eu un service client aussi rapide et efficace. Sans compter la qualité du service en ligne. Je recommande VIVEMENT LWS !

Chris KOUAKAM

Avis hostadvice 12/04/2022

Très bon hébergeur

J'ai un serveur VPS chez eux et je n'ai aucun problème, dès qu'il y a un problème le service technique est la pour vous aider et répond assez rapidement à votre demande. Je recommande vivement cet hébergeur.

Vanden Cruyce

Avis avislws 09/04/2022

Je suis ravie

Je suis ravie d'être avec LWS sur tous les plans, je remercie les Techniciens (Fabrice, Omar, Sandy-Mahitsison) depuis plus de 8 ans j'ai évolué avec LWS et toujours soutenue. Une véritable relation humaine même si les questions ou nos inquiétudes ne correspondent pas à leurs missions, ils sont là pour nous répondent et nous rassurent. Mon site c'est mon travail ma source de revenue donc il sont mes partenaires ! les travailleurs de l'ombre merci à eux ! Merci LWS

L'atelier-and-Co

Commentaires (0)

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée.