Skip To Content

使用页眉和主题选项来打造站点品牌

可通过设计页眉、创建主题或添加页脚自定义站点。

自定义页眉

每个站点都有一个页眉,该页眉将显示在站点的顶部(全球导航栏下方)以及附加到您站点的所有页面和视图上。 该页眉将包含您站点的标题、徽标和菜单链接。 您无法将页眉移除,但可以选择页眉设计。

  1. 编辑模式打开站点。
  2. 通过选择切换 切换 打开侧面板。 选择页眉(选择自定义返回到自定义菜单)。
  3. 外观菜单中,选择以下页眉样式之一:
    • 标准 - 每个新站点的默认设置,该设计具有一个细而紧凑的栏,包含用于放置徽标(60 像素)、社交媒体和菜单链接的空间。
    • 突出 - 该设计将提供较大空间,用于放置大尺寸徽标(120 像素)和额外的菜单链接。
    • 自定义 CSS/HTML - 使用启用了语法的代码编辑器来配置带有自定义代码的页眉。
      注:

      自定义页眉将保留在站点的页面中,但不会在预览页面中显示。

  4. 对于布局,选择
  5. 名称 - 输入要在站点页眉中显示的名称。 您在此字段中提供的名称仅在页眉中显示,将不会反映在站点的 URL 或站点列表中。
  6. 简称 - 输入您已添加到页眉的简化版本名称。 简称仅适用于由于长度过长而导致无法在较小的屏幕(例如手机)上显示的页眉。

    添加一个简称,以确保站点在任何设备上的质量。

  7. 如果您想使用自定义 HTML 或 CSS 标记站点页眉,请选择自定义 HTML/CSS,然后在 HTML 和 CSS 框中提供代码。

    页眉 HTML 不支持嵌入式 JavaScript。 脚本标记将被忽略。

  8. 选择保存

创建主题

通过选择站点的页眉和文本的颜色创建站点的主题。 系统会将在站点主题菜单中选择的颜色应用于整个站点。 您可以通过为特定行配置颜色来覆盖这些选择内容。 有关详细信息,请参阅颜色和字体

提示:

选择颜色时,请查看组织的品牌指南。 许多品牌指南均为诸如网站和徽标等内容提供准确的颜色代码。 如果您没有品牌指南,请咨询您的团队或利益相关者,以确保站点的主题能够正确反映您的组织。

  1. 编辑模式打开站点。
  2. 自定义面板,选择主题
  3. 要为以下任何选项选择颜色,请输入十六进制值颜色代码,或从颜色代码字段旁边的颜色选取器中选择颜色。
    • 全球导航背景颜色将颜色应用于站点的全球导航栏。
    • 全球导航文本颜色将颜色应用于全球导航栏中的文本。
      注:

      有关全球导航的详细信息,请参阅了解全球导航

    • 页眉背景颜色将颜色应用于您站点的页眉。
    • 页眉文本颜色将颜色应用于页眉中的所有文本。
    • 正文背景颜色将颜色应用于您站点的各行。 您还可以遵照颜色和字体中提供的步骤进行操作,以为每行配置行颜色和文本颜色。
    • 正文文本颜色应用于您站点上的文本。
    • 正文链接颜色将颜色应用于您站点上提供的任何链接。
      注:

      垂直选项卡(包括共享按钮)将为背景填充使用正文链接颜色,并为图标或文本使用正文背景颜色

  4. 在设置颜色后,选择保存
  5. 您还可以将字体应用于站点页眉和正文中的文本。
    • 要为站点的正文选择字体,选择基本字体设置按钮。
    • 要更改站点页眉的字体,选择标题字体设置按钮。
注:

要重新开始或返回默认颜色,选择主题菜单底部的重置字体

向页眉添加徽标

站点徽标的大小和位置取决于您选择的页眉样式。

  1. 选择徽标切换按钮将其打开。
  2. 通过选择图像 URL上传添加图像。

    提示:
    如果要从文件上传图像,则另存为 PNG 文件的图像效果最佳。 根据需要裁剪和缩放图像。

  3. 如果您使用的是突出页眉,则可以选择徽标对齐设置。
  4. 对于徽标替代文本,请提供符合可用性标准的文本。

    提示:
    如果徽标上包含文本,则替代文本可以为公司名称。 如果徽标为字体标志设计,则可以将其视为装饰性文本,并针对替代文本键入 “”

  5. 选择保存

向页眉添加社交媒体链接

可向页眉添加链接到 Facebook、X、Instagram 或 YouTube 帐户的社交媒体图标。

  1. 编辑模式打开站点。
  2. 自定义面板上,选择页眉
  3. 展开社交图标
  4. 打开要在页眉中显示的社交媒体平台,并提供平台帐户的 URL。
  5. 选择保存

创建页脚

您可以使用自定义 HTML 向站点添加页脚,该页脚可以在附加到您站点的所有页面中重复出现。

  1. 编辑模式打开站点。
  2. 在侧面板中选择页脚
  3. 选择自定义旁边的切换。
  4. 修改侧面板中的 CSS 和 HTML 框,然后选择保存查看对 HTML 的影响。
    注:

    页脚 HTML 不支持嵌入式 JavaScript。 脚本标记将被忽略。

相关内容

要为您的站点配置更多品牌信息,可执行以下操作: