如何为您的 WordPress 网站添加深色模式(简单)

您想为您的 WordPress 网站添加深色模式吗?

现在许多设备都支持原生暗模式.向您的网站添加深色模式会自动使您的设计适应用户的浏览器偏好.您甚至可以为您的网站添加暗模式切换器切换.

在本文中，我们将向您展示如何轻松地将深色模式添加到您的 WordPress 网站的前端和管理区域.

什么是深色模式以及为什么要将其添加到您的网站?

暗模式用于移动设备和计算机，以减少屏幕上的白光量.

有些设备带有夜间模式，实际上使用的是暖色调.暗模式通过在背景中添加深色来使用不同的方法.

如果您有 iPhone 或 Android 设备，您可以简单地使用切换开关切换到暗模式.

或者，您可以在计算机上使用夜眼等 Chrome 扩展程序在黑暗模式下查看网站.以下是使用该扩展程序的 WPBeginner 网站的外观:

向您的网站添加深色模式后，用户可以在查看您的网站时选择打开和关闭深色模式.它还可以让您更好地控制网站在黑暗模式下的外观.

YouTube 等热门网站也提供深色配色方案.这让用户可以在深夜观看视频，获得更舒适的观看体验.

除了向您的网站前端添加暗模式外，您甚至还可以向 WordPress 管理员添加暗模式.如果您在晚上或晚上在您的网站上工作，这会很有用.

首先，我们将看看向您的 WordPress 网站添加暗模式.然后，我们将介绍向 WordPress 管理仪表板添加暗模式.

提示:您是否希望网站采用深色配色方案，即使用户的设备处于正常或白天模式?然后查看我们的 WordPress 最佳深色主题列表.

为您的 WordPress 网站添加深色模式

首先，您需要安装并激活 WP 暗模式插件.有关更多详细信息，请参阅有关如何安装 WordPress 插件的分步指南.

激活后，转到设置» WordPress 管理员中的 WP 暗模式页面，然后单击常规设置选项卡.您应该会被自动重定向到那里.

此处已为您开启了"启用操作系统感知暗模式"设置.这意味着当访问者的设备设置为深色模式时，他们会自动看到您网站的深色模式版本.

"显示浮动开关"设置也已开启.这意味着用户可以随时将他们的网站视图切换到暗模式，即使他们没有在他们的设备上启用暗模式选项.

只需访问您的网站，您就会在右下角看到开关.单击它可立即将您的网站在您的设备上切换到暗模式:

设置 » 上提供了更多自定义选项.WP 暗模式页面.但是，这些免费插件非常有限.

例如，您只需单击"显示设置"选项卡即可更改浮动开关的样式:

您还可以使用"样式设置"选项卡自定义暗模式颜色:

确保在进行任何更改后单击"保存设置"按钮.

注意:使用免费版 WP 暗模式，您只能获得前 2 种浮动开关样式和前 2 种颜色预设可供选择.

专业版 WP 暗模式提供了更多设计选项，此外还可以在特定时间打开暗模式以及添加自定义 CSS 代码的选项.

为您的 WordPress 管理员添加深色模式

WordPress 带有管理配色方案，但没有任何默认配色方案会减少来自屏幕的白光.幸运的是，这个插件也解决了这个问题.

让我们来看看如何轻松地将黑暗模式添加到您的 WordPress 管理区域，以便在深夜获得更愉快的用户体验.

只需转到设置» WP 暗模式页面，然后单击常规设置选项卡.然后，将"启用后端暗模式"开关切换到打开位置.不要忘记点击页面底部的保存设置按钮:

您现在将在管理区域的顶部栏中看到一个新开关:

只需单击此开关即可立即将您的管理区域切换到暗模式.

提示:如果您的网站有多个 WordPress 用户，每个人都可以根据自己的喜好打开和关闭暗模式.

由于"暗模式"不是管理员配色方案，您可以轻松地将它与现有的 WordPress 管理员配色方案一起使用.要设置它，只需转到用户»配置文件，然后点击管理配色方案下的一个选项.

请注意，您需要关闭暗模式才能看到管理配色方案选项:

在 WordPress 块编辑器中撰写帖子时，您也可以打开暗模式.点击左上角的小颜色图标，然后选择您要使用的模式:

现在，您可以在晚上舒适地在网站上写作和工作，而不会使您的眼睛疲劳.

我们希望本文能帮助您了解如何向 WordPress 网站添加深色模式.您可能还想查看我们关于适用于所有网站的最佳 WordPress 插件的文章，以及我们对最佳管理 WordPress 托管公司的比较.