在布局编辑器中使用默认模块
上次更新时间: 2025年6月6日
可与以下任何订阅一起使用,除非另有说明:
|
|
旧版 Marketing Hub Basic |
HubSpot 在设计管理器的布局编辑器 中提供了用于构建拖放模板的默认模块。您可以添加默认模块或克隆默认模块,以便在拖放模板中使用。此外,您还可以编辑某些默认模块的默认内容。
开始之前
在开始使用该功能之前,请务必充分了解应提前采取的步骤,以及该功能的限制和使用该功能的潜在后果。
了解要求
了解局限性和注意事项
- 本文介绍如何使用设计管理器中布局编辑器的检查器来添加和克隆默认模块。您还可以编辑某些默认模块的默认内容。
- 要使用HubL 向 HTML 模板或自定义模板添加默认模块,请在开发人员文档中了解更多信息。
- 要在内容编辑器中添加和编辑模块,请了解有关在内容编辑器中添加和编辑模块的更多信息。
- Marketing Hub和Content HubProfessional&Enterprise 账户默认在设计管理器中拥有@hubspot文件夹。
- 某些默认模块只能添加到特定的模板类型。例如,表单模块不适用于电子邮件模板。
- 在自定义模块源代码之前,必须克隆默认模块。
为拖放模板添加模块
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 在左侧栏中,单击模板名称 。
- 在右栏中,单击+ 添加。
- 在搜索栏中输入默认或自定义模块的名称 。
- 单击模块名称,然后将其拖入模板。
- 在样式选项 部分的检查器中,为模块设置自定义样式。
- 要防止其他用户编辑模块的默认内容,请单击 "编辑器 "选项 部分的 "防止在内容 编辑器 中编辑 "开关。
克隆默认模块
您可以在设计管理器中的@hubspot文件夹中克隆默认模块,以编辑模块的源代码。该文件夹包含所有主题和默认模块,包括拖放电子邮件模块。
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 在查找器中单击@hubspot文件夹。
- 右键单击默认模块,然后选择克隆模块。
- 在克隆的模块中,编辑模块源代码。了解有关配置模块的更多信息。
- 在右上角单击 "发布更改"。
管理模块版本
HubSpot 可能会定期发布现有默认模块的新版本。这样,HubSpot 就可以在不中断现有内容的情况下实施重大更新。例如,一个模块的新版本可能会提供改进的字段组织、更多的样式选项和改进的功能。在HubSpot 的开发人员文档中了解有关模块版本的更多信息。
您可以从账户的 "主题和模块"设置页面管理模块版本,包括更新版本、恢复到以前的版本或查看所有默认模块的当前版本。
更新模块版本
- 更新到模块的新版本:
-
- 在 HubSpot 帐户中,单击顶部导航栏中的 settings“设置”图标。
- 在左侧边栏菜单中,导航至内容 >主题和模块。
- 在 "警报"选项卡上,默认模块的最新更新将显示为 "可用更新 "标签。单击模块旁边的 "查看更新 "可查看有关更新的更多详细信息。
-
- 在右侧边栏,查看更改。侧边栏将显示更新的高级摘要,以及更改和受影响资产的详细明细。
-
- 要更新模块,请单击安装更新。然后在对话框中单击确认更新。
请注意:页面和模板可能需要 10 分钟才能显示更新的模块。
- 更新模块后,您将进入 "主题和模块"设置页面的 "模块"选项卡。在该页面上,你可以看到最近更新的模块、可用更新的模块以及所有账户默认模块的版本信息。
还原更新的模块
在设置页面的 "模块"选项卡上,可以将过去 30 天内更新过的模块恢复到以前的版本。
- 还原最近更新的模块:
- 在 HubSpot 帐户中,单击顶部导航栏中的 settings“设置”图标。
- 在左侧边栏菜单中,导航至内容 >主题和模块。
- 单击 "模块"选项卡,找到要还原的模块,然后单击 "回滚最近更新"。
-
- 在右侧边栏,查看模块的版本历史,然后单击 "回滚本次更新"。
-
- 查看右侧边栏中的信息,确认要回滚更新,然后单击回滚。
- 在对话框中单击 "确认"。
- 回退模块后,模板和页面可能需要一段时间才能显示回退模块。您可以通过更新模块的版本再次更新模块。
编辑不同类型模块的默认内容
您可以在设计管理器 布局编辑器 的 拖放模板中编辑某些默认模块的默认内容。要查看默认模块的完整列表,请进一步了解默认电子邮件模块和默认网页模块。
备份退订
备份退订模块会显示给点击链接退订且 HubSpot 无法确认其电子邮件地址的电子邮件收件人。该模块只能通过电子邮件备份退订系统模板进行编辑。
- 编辑备份退订模块的默认内容:
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航到您的模板。
- 在布局编辑器中,单击备份退订模块。
- 在默认内容部分的检查器中,输入标题、副标题和错误信息的 文本。
- 完成模块编辑后,单击 "发布更改"。
订阅博客电子邮件
博客电子邮件订阅模块可让访客通过填写表格订阅博客摘要电子邮件。该模块由博客订阅表单填充,表单可在表单工具中自定义。
请注意:博客电子邮件订阅模块不适用于电子邮件模板。
- 编辑博客电子邮件订阅模块的默认内容:
- 完成博客电子邮件订阅模块的编辑后,单击右上角的 "发布更改"。
行动号召
呼叫行动(CTA)模块将 CTA 放置在布局中自己的模块中。您也可以在富文本模块中插入 CTA。
- 编辑 "行动呼吁 "模块的默认内容:

-
- 在右侧窗格中,选择一个CTA 或单击 " 创建新的"。
- 单击 插入。
- 完成呼叫行动模块的编辑后,单击右上角的 "发布更改"。
内容库
您可以使用内容库模块建立一个资源库,供访客访问。
- 编辑内容库模块的默认内容:
- 完成内容库模块编辑后,单击右上角的 "发布更改"。
形式
您可以使用表单模块在内容中添加表单,以获取访客信息。
请注意:表单模块不适用于电子邮件模板。
- 编辑表单模块的默认内容:
- 完成表单模块编辑后,单击右上角的 "发布更改"。
页眉
您可以使用标题模块在标题 HTML 标记中显示一行文本。
- 编辑标题模块的默认内容:
- 编辑完标题模块后,单击右上角的 "发布更改"。
图片
您可以使用图片模块在内容中显示单张图片。
- 完成图像模块编辑后,单击右上角的 "发布更改 "。
图像网格
您可以使用图像网格模块为内容添加统一的图像网格。
- 完成图像网格模块的编辑后,单击右上角的 "发布更改 "。
图像滑块
您可以使用图片滑块模块在同一模块中自动循环显示多张图片。
- 编辑图像滑块模块的默认内容:
- 完成图像滑块模块的编辑后,单击右上角的 "发布更改 "。
语言切换器
您可以使用语言切换器模块为访问者提供在页面或博客的翻译版本之间切换的方法。
请注意:语言切换器模块不适用于电子邮件模板。
- 编辑语言切换器模块的默认内容:
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至模板。
- 在布局编辑器中,单击语言切换器模块或添加该模块。
- 在 "默认内容"部分的检查器中,选择 "向下添加雪佛龙"复选框,以显示语言切换器的雪佛龙。
- 单击显示模式下拉菜单,选择以下其中一种:
- Pagelang:每种语言的名称,将以当前页面的语言显示。例如,如果你正在浏览一个有法语翻译的英文版页面,当你点击语言切换器时,你会看到英语和法语作为语言名称。
- 本地化:每种语言的名称将以该语言显示。例如,如果你正在浏览一个有法语翻译的页面的英文版,当你点击语言切换器时,你会看到英语和法语作为语言名称。
- 混合语言: 两种语言的组合。例如,如果您正在浏览一个页面的英文版和法文翻译版,当您点击语言切换器时,您将看到英文和法文(Français)作为语言名称。
- 点击图标选项下拉菜单,选择无、图标或自定义图标。
- 完成语言切换器模块的编辑后,单击右上角的 "发布更改 "。
请注意:该模块只会出现在有多个已发布翻译的实时页面上。了解有关在 HubSpot 中使用多语言内容的更多信息。
标志
您可以使用徽标模块在内容中显示 品牌套件中的公司徽标。
- 编辑徽标模块的默认内容 :
- 完成徽标模块编辑后,单击右上角的 "发布更改 "。
徽标网格
您可以使用徽标网格模块,将不同尺寸的多个徽标排列在一致的网格中。
- 编辑徽标网格模块的默认内容:
- 完成徽标网格模块的编辑后,单击右上角的 "发布更改 "。
电子邮件正文
电子邮件正文主模块是一个标准的富文本模块,默认包含在每个电子邮件模板中。
- 编辑电子邮件正文模块的默认内容:
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至模板。
- 在布局编辑器中,单击主电子邮件正文模块。
- 在 "默认内容"部分的检查器中,单击expandIcon展开图标 ,编辑电子邮件正文中出现的文本。
- 编辑电子邮件正文模块的样式选项:
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至模板。
- 在布局编辑器中,单击主电子邮件正文模块。
- 在样式选项 部分的检查器中,在文本颜色、背景颜色和边框颜色的文本字段中输入十六进制值 。 您也可以单击 颜色选择器。
- 编辑完电子邮件正文模块后,单击右上角的 "发布更改" 。
菜单
您可以使用菜单模块为内容添加导航。菜单可直接在导航菜单设置中创建和管理。
- 编辑菜单模块的默认内容:
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至模板。
- 在布局编辑器中,单击菜单模块或添加该模块。
- 在默认内容部分的检查器中,单击菜单下拉菜单并选择现有菜单 或单击创建新 菜单 。
- 在高级菜单类型 下拉菜单中,选择以下其中一种:
- 静态 - 始终在菜单中显示顶层页面:在所有页面中保持菜单一致。
- 按部分动态显示 - 在菜单中显示与正在查看的部分相关的页面:显示与正在查看的顶层菜单项相对应的菜单项。
- 按页面动态显示 - 在菜单中显示与正在浏览的页面相关的页面: 显示与正在浏览的特定页面相关的菜单项。
- 面包屑式路径菜单(使用水平流): 在网站顶部以相对路径水平显示菜单项。
- 在最大层级字段中,输入可显示的子菜单项的最大数量。
- 在方向下拉菜单中,选择水平或垂直。
- 要在将鼠标悬停在父导航上时显示子菜单项,请选择启用飞出复选框。
- 完成菜单模块编辑后,单击右上角的 "发布更改 "。
办公地点信息
办公地点模块包括发送营销电子邮件时必须包含在电子邮件模板中的必要令牌。
- 编辑办公室位置信息模块的默认内容:
- 编辑办公室位置信息模块的样式选项:
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至模板。
- 在布局编辑器中,单击 "办公室位置信息 "模块。
- 在样式选项 部分的检查器中,在文本颜色、背景颜色和边框颜色的文本字段中输入十六进制值 。 也可以单击 颜色选择器。
- 完成办公室位置信息模块的编辑后,单击右上角的 "发布更改 "。
一行文字
您可以使用一行文字模块在内容中添加一行文字。
- 编辑完一行文本模块后,单击右上角的 "发布更改" 。
密码提示
密码提示模块可用于密码提示系统模板。如果页面受密码保护,则在用户访问页面前会显示密码提示页面。
- 编辑密码提示模块的默认内容:
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至密码提示模板。
- 在布局编辑器中,单击密码提示模块。
- 在 "默认内容"部分的检查器中,单击expandIcon 展开图标 ,编辑密码错误信息文本。
- 完成密码提示模块的编辑后,单击右上角的 "发布更改 "。
邮政过滤器
您可以使用文章过滤模块来显示特定主题、月份或作者的博客文章列表。
- 编辑帖子过滤模块的默认内容:
-
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至模板。
- 在布局编辑器中,单击 "帖子筛选器"模块。
- 在 "默认内容"部分的检查器中,在 "选择要显示的博客"下拉菜单中选择要显示的博客。
- 在筛选链接的值列表下拉菜单中,选择标签、月份或作者。
- 在筛选链接的值排序下拉菜单中,选择文章数量或名称。
- 在要显示的列表标题字段中,输入将作为列表标题显示的文本。
- 要显示所有筛选器,请选择显示所有筛选器复选框。
- 在显示筛选器值的最大数量字段中,输入筛选器的帖子数量。
- 如果要显示的值超过最大值,则在文本中显示。留空以省略链接字段,输入类别中有更多可用帖子时将显示的文本。
- 编辑完帖子过滤模块后,单击右上角的 "发布更改 "。
职位列表
您可以使用博文列表模块来显示博客中的博文列表。
- 编辑帖子列表模块的默认内容:
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至模板。
- 在布局编辑器中,单击文章列表模块。
- 在 "默认内容"部分的检查器中,在 "选择要显示的博客"下拉菜单中选择要显示的博客。
- 在 "按帖子排序"下拉菜单中,选择 "最近"、"最受欢迎-所有时间"、"最受欢迎-过去一年"、"最受欢迎-过去 六个月"或 "最受欢迎-过去一个月"。
- 在Choose what shows in your feed 字段 中,选择图片、标题、作者姓名和/或发布日期旁边的复选框。
- 在要列出的最多博文字段中,输入要显示的最多博文数量。
- 在文章标题字段中,输入模块顶部显示的文本。
- 在标题级别下拉菜单中,选择模块内容的标题级别(H1-H6)。
- 编辑完帖子列表模块后,单击右上角的 "发布更改 "。
产品
您可以使用产品模块在页面和文章中显示产品库中的产品。产品的默认信息会显示出来,但您可以选择在每个页面上覆盖它。
- 编辑产品模块的默认内容:
- 完成产品模块编辑后,单击右上角的 "发布更改 "。
丰富的文本
富文本模块支持文本、图像和 CTA 等不同组件的编辑选项。
- 编辑富文本模块的默认内容:
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至模板。
- 在布局编辑器中,单击富文本模块或添加该模块。
- 在默认内容部分的检查器中,单击expandIcon 展开图标 编辑富文本内容。了解有关编辑富文本模块内容的更多信息。
- 完成富文本模块编辑后,单击右上角的 "发布更改 "。
RSS 列表
您可以使用 RSS 列表模块来显示 HubSpot 博客或外部 RSS 源的博文摘要。
请注意:RSS 列表模块不适用于电子邮件模板。请使用RSS 电子邮件。
- 编辑 RSS 列表模块的默认内容:
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至模板。
- 在布局编辑器中,单击RSS 列表模块或添加该模块。
- 在默认内容部分的检查器中,为RSS 标题字段输入文本。
- 在 "添加 RSS 订阅 "字段中,选择 "使用外部 RSS 订阅 "或"使用 HubSpot 托管的博客"。
- 在 "博客 "下拉菜单中,选择一个博客。
- 在 "按标签过滤"下拉菜单中,选择一个标签。
- 在 "要显示的最大帖子数 "字段中,输入帖子数。
- 要包含特色图片,请选择包含特色图片 复选框。
- 要显示作者姓名,请选择显示作者姓名 复选框。
- 在作者署名文本字段中,输入要显示的文本。默认情况下,作者署名文本包括by。
- 要显示博客摘要,请选择显示摘要 复选框。
- 在限制摘要长度(字符数)字段中,输入限制摘要的字符数。
- 在摘要点击文本字段中,输入要显示的文本。默认文本包括 "阅读更多"。
- 要显示发布日期,请选择显示发布日期 复选框。
- 在发布日期格式 下拉菜单中,选择发布日期的格式。
- 在发布日期指示器文本字段中,输入要显示的指示器文本。默认文本包括发布日期。
- 编辑完 RSS 列表模块后,点击右上角的 "发布更改 "。
章节标题
您可以使用章节标题模块,在标题标签中显示带有段落副标题的文本。
- 编辑章节标题模块的默认内容:
- 编辑完章节标题模块后,单击右上角的 "发布更改 "。
简单菜单
您可以使用简单菜单模块为特定模板创建菜单。
- 编辑简单菜单模块的默认内容:

-
- 要编辑简单菜单,请单击添加菜单项。然后为菜单项标签字段 输入文本。 默认菜单项类型设置为页面链接。
- 要将菜单项类型更改为外部 URL 链接,请单击操作 下拉菜单 和 ,然后单击URL 链接。
- 要将菜单项类型更改为无 URL 链接,请单击操作下拉菜单,然后单击无链接。
- 要将菜单项类型更改为带URL参数的HubSpot托管页面,请单击 "操作"下拉菜单,然后单击带URL参数的页面链接。
- 要编辑简单菜单,请单击添加菜单项。然后为菜单项标签字段 输入文本。 默认菜单项类型设置为页面链接。

-
- 在 "菜单方向"字段中,选择 "水平"或"垂直"。更改菜单方向设置后,
hs-menu-flow-horizontal
或hs-menu-flow-vertical
类将添加到菜单包装容器中。该类可用于在 CSS 中设置菜单样式。有关模块设置添加的类的更多信息,请参阅开发人员文档。
- 在 "菜单方向"字段中,选择 "水平"或"垂直"。更改菜单方向设置后,
- 完成简单菜单模块的编辑后,单击右上角的 "发布更改 "。
社会共享
您可以使用社交分享模块,为访客提供在社交媒体渠道和电子邮件中分享内容的选项。
- 编辑社交共享模块的默认内容:
请注意:社交分享模块使用每个社交网络的默认图标。如果您想使用自己的自定义社交图标,可以创建一个自定义版本的模块。
- 完成社交分享模块的编辑后,点击右上角的 "发布更改 "。
社会关注
您可以使用社交关注模块为访客提供在社交媒体上关注贵公司的选项。
- 编辑社交关注模块的默认内容:
-
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至模板。
- 在布局编辑器中,单击社交关注 模块或添加该模块。

-
- 要编辑社交关注模块中的现有社交链接,请单击检查器中的editIcon编辑 图标。您可以自定义 URL,并选择 "在新窗口中打开链接"、"此链接是播客"、"自定义 alt 文本"和/或 "自定义图标复选框"。
- 完成社交关注模块的编辑后,单击右上角的 "发布更改 "。
订阅偏好
您可以使用订阅偏好模块自定义电子邮件收件人在管理订阅偏好时看到的内容。该模块仅适用于订阅首选项系统模板。
-
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至您的模板。
- 在布局编辑器中,单击订阅首选项模块 。
- 在 "默认内容"部分的检查器中,为 "标题"字段输入文本。
- 在标题标题 级别 下拉菜单中,选择标题级别(H1-H6)。
- 在电子邮件标题级别下拉菜单中,选择一个标题级别(H1-H6)。
- 在副标题字段中,单击expandIcon 展开图标 编辑 文本。

-
- 在以下字段中输入所需的文本:
- 首选项选择帮助文本
- 取消订阅所有帮助文本
- 取消当前取消订阅用户的所有帮助文本
- 全部取消订阅标签
- 更新首选项按钮文本
- 重新订阅按钮文本
- 在以下字段中输入所需的文本:

- 完成订阅首选项模块的编辑后,单击右上角的 "发布更改"。
订阅更新确认
您可以使用订阅更新确认模块,自定义电子邮件收件人更新订阅偏好时显示的内容。该模块仅适用于电子邮件订阅确认系统模板。
-
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至系统模板。
- 在布局编辑器中,单击订阅更新确认模块 。
- 在 "默认内容"部分的检查器中,为 "标题"字段输入文本。
- 在标题标题级别 下拉菜单中,选择标题级别(H1-H6)。
- 在电子邮件标题级别下拉菜单中,选择一个标题级别(H1-H6)。
- 在副标题字段中,单击expandIcon 展开图标 编辑 文本。
-
- 在取消订阅时的信息字段 中,输入访客取消订阅时要显示的文本。
- 在 "订阅更新时的消息"字段中,输入访客更新订阅偏好时要显示的文本。
- 完成订阅更新确认模块的编辑后,单击右上角的 "发布更改"。
以网页形式查看
您可以使用 "视图为网页 "模块,为电子邮件收件人提供以网页形式打开营销电子邮件的选项。了解有关使用网页版电子邮件模块的更多信息。
- 编辑视图为网页模块的默认内容:
- 编辑电子邮件正文模块的样式选项:
- 编辑完电子邮件正文模块后,单击右上角的 "发布更改" 。
WhatsApp 链接
您可以使用 WhatsApp 链接模块为网站访客提供直接与您联系的选项。该模块可添加到网页、博客文章和博客列表页面。要使用此模块,您需要将WhatsApp 频道连接到您的会话收件箱。
请注意:本模块仅适用于Marketing Hub 和 Service Hub Professional 和Enterprise账户。
- 编辑 WhatsApp 链接模块的默认内容:
- 在 HubSpot 帐户中,导航到内容 > 设计管理器。
- 导航至您的模板。
- 在布局编辑器中,点击WhatsApp 链接模块或
或添加模块。 - 在 "默认内容"部分的检查器中,单击 "转到设置",将WhatsApp 频道连接到会话收件箱。
- 在 "选入文本"下拉菜单中,选择 "选入 "选项。
- 在 "显示"下拉菜单中,选择 "文本和图标"、" 仅文本"或"仅图标"。
- 在图标位置下拉菜单中,选择左侧或右侧。
- 在按钮文本字段中,输入将显示在按钮上的文本。默认文本将显示WhatsApp 上的聊天。
- 在 Whatsapp 图标标题字段中,输入标题文本以方便访问。默认文本为WhatsApp 图标。
- 完成 WhatsApp 链接模块的编辑后,点击右上角的 "发布更改"。