如何在 WordPress 网站上自定义颜色 - 如何在 WordPress 中自定义颜色

您可以使用许多不同的方法在 WordPress 中自定义颜色，包括主题定制器、完整站点编辑器、自定义 CSS、页面构建器插件等。

使用主题定制器更改颜色

使用内置的WordPress主题定制器更改颜色非常容易。

首先，从管理侧边栏访问外观»自定义页面。

注意： 如果您在WordPress仪表板中找不到“自定义”选项卡，则表示您正在使用块主题。向下滚动到本教程的下一部分，了解如何更改块主题中的颜色。

在本教程中，我们将使用默认的 Twenty Twenty-One 主题。

请记住，根据您当前使用的主题，模板定制器的外观可能会有所不同。

例如，Twenty Twenty-One 主题带有“颜色和深色模式”面板，允许用户选择背景颜色并自定义深色模式。

打开面板后，只需单击“选择颜色' 选项。这将打开颜色选择器，您可以在其中选择您喜欢的背景颜色。

完成后，不要忘记单击顶部的“发布”按钮以保存更改并使其在您的网站上生效。

在完整网站编辑器中更改颜色

如果您使用的是基于块的主题，则无法访问主题定制器。但是，您可以使用完整站点编辑器 （FSE） 更改网站上的颜色。

首先，从管理侧边栏前往外观»编辑器屏幕以启动完整的站点编辑器。

现在，您必须单击屏幕右上角的“样式”图标。

这将打开“样式”列，您需要在其中单击“颜色”面板。

您可以从此处更改主题的背景、文本、链接、标题和按钮颜色。

完成后，单击“保存”按钮以存储您的设置。

使用自定义 CSS 更改颜色

CSS 是一种可用于更改网站视觉外观（包括其颜色）的语言。您可以在模版设置中保存自定义 CSS，以将自定义应用于整个网站。

但是，如果您在网站上切换主题或更新现有主题，则自定义 CSS 代码将不再适用。

这就是为什么我们建议使用WPCode插件，这是市场上最好的WordPress代码片段插件。这是添加自定义CSS代码的最简单方法，它将允许您安全地自定义WordPress网站上的颜色。

首先，您需要安装并激活WPCode插件。

注意： 还有一个免费的WPCode版本，你可以使用。但是，我们建议升级到付费计划以释放插件的全部潜力。

激活WPCode后，您需要从管理员侧边栏访问代码片段» +添加代码片段页面。

只需点击“添加自定义代码段（新代码段）”标题下的“使用代码段”按钮即可。

进入“创建自定义代码段”页面后，您可以先键入代码的名称。

之后，只需从下拉菜单中选择“CSS片段”作为“代码类型”。

接下来，您必须在“代码预览”框中添加自定义 CSS 代码。

在本节中，我们将添加自定义CSS代码来更改网站上的文本颜色：

p { 
color:#990000; 
}

完成此操作后，向下滚动到“插入”部分。

在这里，如果您希望代码在激活时自动执行，您可以选择“自动插入”选项。

您还可以向特定的WordPress页面或帖子添加短代码。

完成后，只需滚动回页面顶部并将“非活动”开关切换为“活动”。

最后，您需要单击“保存代码段”按钮将CSS代码应用于您的网站。

使用 SeedProd 更改颜色

您还可以使用SeedProd插件自定义颜色。

它是市场上最好的WordPress页面构建器，可让您从头开始创建主题，而无需使用任何代码。

首先，您需要安装并激活 SeedProd 插件。

激活后，从WordPress管理侧边栏前往SeedProd » Theme Builder页面。

从这里，单击顶部的“主题模板套件”按钮。

注意： 如果您想从头开始创建自己的主题，则需要单击“+添加新主题模板”按钮。

这将带您进入“主题模板套件选择器”页面。在这里，您可以从 SeedProd 提供的任何预制主题模板中进行选择。

选择主题后，您将被重定向到“主题模板”页面。

在这里，您需要将“启用种子生产主题”开关切换为“是”以激活主题。

现在，您必须单击任何主题页面下的“编辑设计”链接以打开拖放编辑器。

到达那里后，单击左列底部的齿轮图标。

这会将您定向到“全局 CSS”设置。

从这里，您可以自定义网站背景、文本、按钮、链接等的颜色。

对选择感到满意后，单击“保存”按钮以存储您的设置。