如何将 Elementor 更改为暗模式?
已发表: 2022-10-18即使没有任何经验,您也可以轻松地构建一个功能强大的网站。 您只需使用像 Elementor 这样的 WordPress 插件。 但是在提高网站的可读性时,您将不得不考虑将 elementor 更改为暗模式。 现在,您可能想知道,我首先如何将 elementor 更改为暗模式?
嗯,不像 QS 暗模式这样的插件,elementor 没有默认的暗模式插件。 这意味着您必须安装第三方插件。 使用QS 暗模式插件的另一个好处是因为它比 elementor 更易于实现且对用户更友好。
因此,在本教程中,我们将了解如何通过不同的插件将 elementor 更改为暗模式的步骤。
目录
为什么需要激活 Elementor 暗模式?
elementor 暗模式的使用在必要性和流行度上都在增加。 因此,如果您想知道是否真的需要启用暗模式,这里有答案。
减少眼睛疲劳
长时间暴露在蓝光下会导致数字眼睛疲劳以及眼睛干涩和头痛等症状。 因此,激活 element 或暗模式可以帮助保护您的眼睛免受强光引起的眼睛疲劳和疲劳。
提高可读性
为 elementor 使用暗模式的另一个好处是它可以让你的屏幕更高效,以增强可读性。 尤其是当房间里有太多的阳光时,这会使阅读变得困难。 因此,如果您有博客,您的用户将更有可能在您的网站上花费更长的时间。
更好的能见度
暗模式的使用在弱光环境中也很方便。 简而言之,它可以在黑暗或昏暗的环境中提供更好的可见性。 例如,您可以在床上使用它,而不必担心会吵醒您的伴侣。
节省电池寿命
与正常模式相比,elementor 或wordpress 暗模式 android倾向于使用更少的能量。 因此,您的手机或笔记本电脑的电池可能会持续更长时间。 一些专家建议,它可以将电池寿命延长约 30%。
出于审美目的
与 element 或 normal 模式下的其他配色方案相比,此模式提供了非常漂亮和时尚的用户界面。 它为您提供了一些神秘而新颖的东西。
如何将 Elementor 更改为暗模式?
那么,您究竟如何将网站的 elementor 更改为暗模式? 毕竟,没有办法在你的 elementor 博客上默认启用暗模式功能。 在这种情况下,您只需使用第三方插件,如WP Dark Mode或 Elementor 的 Plus Addons。 这两个选项均提供免费版和专业版。
方法一:使用 WP 暗模式
这是将 elementor 更改为暗模式的最常见和流行的插件。 它提供了许多功能,包括 elementor 小部件的暗模式和多种开关样式。 以下是有关如何使用此插件的步骤。
第 1 步:规划暗模式颜色
您需要首先确定要将哪些元素更改为暗模式。 这是因为,在某些情况下,您可能已经拥有无需更改的深色背景。 在大多数情况下,您可能必须更改整体背景颜色,包括字体和图像。

第 2 步:安装 WP 暗模式
接下来,您应该下载WP Dark Mode插件。 只需在您的 WordPress 仪表板上搜索插件并单击它。 然后,选择 Add New 并寻找 WP Dark Mode。 最后,单击立即安装以激活插件。
第 3 步:启用暗模式
完成安装WP Dark Mode后,接下来就是启用暗模式。 您可以选择为单个页面或整个网站激活它。
第 4 步:为单个页面激活暗模式
首先,您应该添加一个新页面或简单地使用已经存在的页面。 在您的 WordPress 管理仪表板上,只需单击页面,然后添加新的。 然后,命名您的页面并在右侧边栏上,选择页面模板作为 Elementor Full Width。 接下来,选择使用 Elementor 编辑选项。
之后,在搜索小部件选项上搜索暗模式。 从这里,将小部件拖放到您正在编辑的页面中。 完成后,您可以发布您的页面。
第 5 步:为整个站点激活 WP 暗模式
您还可以选择将 elementor 更改为整个网站的暗模式。 在这种情况下,您首先选择 WordPress Admin Dashboard 上的WP Dark Mode小部件,然后进行设置。 之后,单击常规设置上的启用前端暗模式。
接下来,单击设置上的“显示浮动开关”选项卡将其打开。 您会注意到一个新的切换开关将出现在 WordPress 管理栏的顶部。 这就是您将用来将 elementor 更改为暗模式的方法。
第六步:选择浮动开关的样式
激活您的wp admin dark mode后,您可以对其进行自定义以获得个性化的外观。 您可以选择几种浮动开关样式。 因此,您只需要选择一个与您的博客相匹配的主题即可。
单击夜间模式选项卡,然后选择开关设置。 您将看到不同风格的前端浮动开关,包括浅色主题和深色主题。 最后,选择保存设置。 现在应该在您网站的所有页面上激活elementor 的暗模式。
方法二:使用 Plus 插件
elementor 的 Plus 插件包含一组小部件和模板,可帮助您使用 elementor 自定义网站。 此插件允许您在页眉或页脚区域添加小部件。 请按照以下步骤使用此工具将博客的元素更改为暗模式。
第 1 步:下载 Plus 插件
在您的 WordPress 管理仪表板上,单击插件并选择添加新的。 您将被定向到插件存储库。 在搜索栏中,输入 Elementor 的 Plus 插件,然后单击立即安装按钮。
安装后,Plus 设置应出现在仪表板左下角的底部。
第 2 步:激活暗模式小部件
安装 Plus Addons 后,在 Plus Addon 仪表板上选择 Plus Widgets。 然后,在搜索框中键入暗模式,只需将切换开关移至右侧即可将其打开。
第 3 步:在 elementor 编辑器中添加小部件
要添加暗模式小部件,请打开您网站的标题,然后点击“使用 Elementor 编辑”选项卡。 接下来,在 Elementor 小部件面板中键入暗模式小部件。 最后,将小部件拖放到右侧。
第 4 步:将 elementor 更改为暗模式
在 elementor 暗模式小部件上,选择内容选项卡。 您将看到三个选项,包括暗模式、位置和额外选项。 选择暗模式选项,从不同深浅的暗模式中选择适合您网站或品牌的主题。
如果您想进一步自定义暗模式,您可以使用额外的选项设置。 单击保存设置以应用更改。 在这个阶段,您的 elementor 应该处于暗模式设置。
Elementor 普通模式与暗模式:有什么区别?
Elementor 正常模式带有 4 种预定义或默认的全局颜色。 这些颜色包括主要颜色、文本颜色、上升颜色和次要颜色。 主要颜色用于标题和图标,而辅助颜色用于列表项、价格表背景和子标题。 同时,文本颜色用于菜单项和段落,而强调色用于徽章和链接。
使用 elementor 暗模式,它包括较暗的背景颜色和较浅的前景颜色。 与普通模式不同,此模式不是 Elementor 的默认设置。 因此,您将不得不使用免费或专业的暗模式插件来激活它。 在黑暗模式下,elementor 仅使用两组背景颜色来创建夜间模式外观。
深色模式颜色选择器的用途是什么?
使用深色模式时,您可以选择不同的深色调色板来匹配您网站的风格。 颜色选择器可帮助您选择视觉元素的最佳颜色。 换句话说,您可以使用深色模式颜色选择器来快速选择要在您的设计中使用的颜色。
除了允许您选择颜色外,暗模式的颜色选择器还允许您存储这些颜色。 您可以轻松保存常用颜色,以便在需要时随时访问。
此外,颜色选择器允许您通过拖放功能删除不再需要的颜色。 更重要的是,它可以让你直接从选择器中以正确的顺序重新排列你最好的暗模式颜色。
结论
无论您是想将 element 更改为暗模式以增强可读性或可见性,您都可以轻松做到。 您只需要知道要使用哪些插件以及激活 element 或暗模式所要遵循的步骤。 这是因为,与QS 暗模式等插件不同,elementor 没有内置的默认暗模式插件。
幸运的是,您可以在上面找到所有这些信息。 但是,值得一提的是,您可以使用其他插件将 elementor 更改为暗模式。
为了更加方便,我们建议在深色模式下使用颜色选择器。 在为您的不同页面选择正确的深色模式颜色和主题时,它可以节省您的时间。
单个博客文章模板