模板设计

通过 拖放构建块 来设计网站页面,然后 排列 和 编辑 这些构建块,以满足您的内容和布局需求。您还可以创建 自定义构建块 或 锚点链接。

可以使用网站编辑器添加和自定义构建块。要打开网站编辑器,请转到相关页面,然后点击右上角的 编辑。

添加模板内容块

要将构建块添加到 网站页面,请访问该页面,然后从 块 选项卡中将所需的构建块拖放到适当位置。

可用的构建块有两种:

  • 分类构建块为不同的内容类别提供模板。

  • 内部内容 构建块允许将元素(例如 视频、图片、按钮 等)添加到现有的分类构建块以及 页眉和页脚 中。

添加分类构建块时,会出现一个弹出窗口,您可以在其中从不同类别的多个模板中进行选择。放置构建块后,将 内部内容 构建块拖放到其中。

小技巧

  • 使用 插入构建块 弹出窗口中的搜索栏快速找到特定的构建块。

    弹出块选择
  • 构建块也可以添加到登录页面。要访问登录页面,请导航到网站主页,在 URL 后添加 /web/login,然后按 Enter 键。

注解

某些构建块需要安装相应的应用或模块(例如,预约 构建块需要 Appointments 应用)。

示例

使用 社交媒体 内部内容 构建块显示您社交媒体账号的链接。点击 添加新社交网络 可添加平台,点击 (移除链接)可将其移除。您还可以编辑账号 URL。

社交媒体内部内容块

嵌入代码

嵌入代码可让您集成来自第三方服务的内容,例如 YouTube 视频、Google Maps 以及 Instagram 帖子。

将 嵌入代码 构建块从 内部内容 部分拖放到页面上后,点击该构建块,然后转到 样式 选项卡。向下滚动到 嵌入代码 部分,在 代码 旁边点击 编辑。用自定义嵌入代码替换占位符代码。

将链接添加到您要指向的嵌入代码中。

警告

请仅使用来自可信来源的嵌入代码。复制并粘贴您不理解的代码可能会使您的数据面临风险。

移动、复制或删除构建块

要调整构建块的位置和大小,请使用以下选项:

  • 拖动构建块上的青绿色边框,以增加或减少顶部或底部的空间。

  • 点击 (上移)或 (下移)图标可更改构建块的顺序。

  • 点击 (拖动并移动)图标可在页面上移动构建块。

  • 当构建块包含多个 列 时,可通过点击 (左移)或 (右移)将列向左或向右移动。

  • 点击 (复制)可创建构建块的副本。副本会添加在原始构建块的下方。

  • 点击 (移除)可删除构建块。

    用于移动、复制或移除构建块的选项。

小技巧

或者,点击该构建块,转到 样式 选项卡,然后点击选项卡顶部的 (复制此构建块)或 (移除此构建块)图标。

示例

通过单击并拖动其边缘周围的点来调整块的大小。

修改块大小

编辑构建块

要自定义构建块,请点击该构建块并转到 样式 选项卡。可用的自定义选项因所选构建块的类型而异。大多数构建块提供用于自定义 背景、布局、形状 和 内容尺寸 的选项。

背景

要自定义构建块的背景,请点击颜色圆点或其他 背景 选项。根据所选选项,您可以更改背景 颜色 和/或添加 图片、视频 和/或形状。选择选项后,还可使用其他选项对其进行自定义。

小技巧

在 网格 布局中,使用 置于底层 或 置于顶层 图标将图片和文本等元素放置在其他元素的后方或前方。

将构建块移到后方或前方。

布局

大多数构建块支持两种布局样式:网格 和 列。要更改默认布局,请点击该构建块,转到 样式 选项卡,然后将 布局 字段设置为 网格 或 列。

网格

网格 布局允许您通过拖放元素来重新定位和调整其大小。您还可以使用 间距 选项调整元素的位置和大小。

列

列 布局允许您指定构建块中每行的元素数量。为此,请选择要修改的构建块,点击 列 字段旁边的下拉菜单,并调整数量。然后,您可以使用 样式 选项卡中 列 部分的选项修改特定列的设置。

注解

默认情况下,在移动设备上,每行仅显示一个元素(列),以确保内容在较小屏幕上仍然易于阅读和访问。要调整此值,请点击网站编辑器顶部的 (移动端预览)并调整列数。在移动设备上,形状默认处于隐藏状态。

形状

要为构建块添加形状,请点击 形状 设置旁边的 无,然后选择一个形状。您可以使用 (水平翻转)和 (垂直翻转)按钮更改 颜色 并 变换 形状。

点击 移除形状 将其移除,并 管理其在移动设备上的可见性。

内容尺寸

要调整构建块的内容尺寸:

  • 使用 内容宽度 选项,使内容填满整个页面宽度,或在其周围添加间距。

  • 将 自动 高度 设置为 50% 或 100%。

保存自定义构建块

保存自定义的构建块,以便在其他页面上重复使用。为此,请选中该构建块,前往 样式 选项卡,然后点击 (将此构建块保存到其他地方使用)图标。在弹出窗口中点击 保存 按钮以确认。

要将已保存的构建块添加到页面,请前往 构建块 选项卡,拖放 自定义 分类构建块。在打开的弹出窗口中,点击 自定义 类别中所需的构建块。

小技巧

在 插入构建块 弹出窗口中,点击 (重命名)以重命名自定义构建块,或点击 (移除)将其删除。