使用样式更改站点的颜色

您选择的颜色是站点设计的重要组成部分。本指南将向您介绍如何管理站点的调色板。

在此指南中

1. 视频概览
2. 找到颜色设置
3. 定义调色板
   1. 主题颜色
   2. 自定义颜色
4. 自定义元素的颜色

视频概览

找到颜色设置

如果您的站点使用的是支持站点编辑器的主题，则您可以使用“样式”来更改站点的颜色。请查看仪表盘中的“外观”，快速查看您的站点是否支持使用站点编辑器。如果您在此处看到“编辑器”，则可以按照以下步骤更改您站点的颜色：

1. 在仪表盘中，转到“外观 → 编辑器”。
2. 点击左侧的“样式”，或选择此处所示的“样式”图标。图标看起来像一个黑白圆圈。
3. 选择“颜色”。
4. 选择“调色板”以选择您站点的默认颜色，或从站点上的以下元素中进行选择：
   • 文本
   • 背景
   • 链接
   • 说明文字
   • 按钮
   • 标题

本指南的剩余部分将更详细地解释每一项元素。

定义调色板

站点的调色板可设置整个站点使用的默认颜色。尽管您仍然可以控制特定元素的颜色，但定义您的调色板可以确保站点始终保持一致的配色方案。

您可以在此处编辑“主题”、“默认”和“自定义”颜色：

• 主题：主题设计者在创建主题时设置的颜色，用于整个主题的设计。
• 默认：编辑页面和文章时，区块颜色设置中显示的颜色。
• 自定义：定义并命名您要在调色板中使用的其他颜色。

主题颜色

要更新“主题”颜色，请按照以下说明执行操作：

1. 点击“调色板”下方框中的任意位置。

2. 点击“主题”旁边的三个点，然后选择“显示详情”，展开调色板中的颜色区域列表。
3. 每个主题都定义了自己的颜色区域。在示例中，我们可以选择“主色”、“副色”、“前景色”、“背景色”或“第三色”来编辑该颜色：

更新站点编辑器的“样式”板块中的“主题”和“默认”颜色的步骤

4. 使用弹出的颜色选择器选择您想要的颜色。
5. 点击“完成”，设置您所选的颜色。
6. 点击右上角的“保存”，保存您的更改。

自定义颜色

您还可以为站点的调色板添加多种“自定义”颜色。这些自定义颜色将保存并可供您从区块的颜色设置中进行选择。

要添加自定义颜色，请按照以下补充步骤操作：

1. 在“自定义”下点击“+”按钮。
2. 从颜色选择器中选择颜色，或输入 HEX、RGB 或 HSL 颜色值。
3. 点击颜色的名称（默认为“颜色 1”），然后为新颜色输入名称。
4. 点击“完成”。

下面是这些步骤的视频演示：

自定义元素的颜色

在位于“调色板”右下角的颜色设置中，您会看到编辑站点各个元素颜色的选项。这些元素包括：

• 文本：选择一种颜色，用于站点上的所有常规基础文本，不包括链接、说明文字、按钮文本或标题。
• 背景：选择纯色或渐变色作为站点的背景。如需了解更多信息，请参阅我们的自定义您站点的背景指南。
• 链接：选择一种颜色，用于您站点上的所有链接。在这里，您可以选择所有链接显示的“默认”颜色，以及有人将光标悬停在链接上时显示的“悬停”颜色：

• 说明文字：选择图片区块说明文字中使用的文本颜色。
• 按钮：设置用于按钮区块的颜色。您可以选择文本颜色，并为按钮的背景设置纯色或渐变色。
  • 目前不支持控制按钮的悬停颜色。您可以使用 CSS 代码来为按钮应用悬停颜色。
• 标题：为站点上的所有“标题”区块设置一种颜色。您可以选择文本颜色，并为标题的背景设置纯色或渐变色。
  • 要为每个标题级别（ H1 到 H6 ）选择不同的颜色，请点击“颜色”旁边的三个点，展开选项，然后点击相应的标题级别。标题级别旁边会显示一个复选标记，然后您可以关闭这些选项，访问该标题级别的颜色设置。

如果您只想覆盖某个特定文本（而不是所有元素）的颜色，则可以在特定文章或页面中的个别区块颜色设置中设置不同的颜色。