跳到内容

在 HubSpot 内容中使用图片

上次更新时间: 二月 12, 2025

除非另有说明,否则适用于以下任何订阅

所有产品和计划

您可以在HubSpot 内容的富文本模块或图片模块中添加图片。富文本模块支持多种类型的内容(图片、文本、CTA 等),而每个图片模块只能包含一张图片。

请注意: 拖放电子邮件编辑器中的文本模块和自定义富文本模块不能包含图片。

添加图片

  • 导航至您的内容:

    • 网站页面:在 HubSpot 帐户中,导航到内容 > 网站页面
    • 登陆页面:在 HubSpot 帐户中,导航到内容 > 登陆页面
    • 博客:在 HubSpot 帐户中,导航到内容 > 博客
    • 知识库:在 HubSpot 帐户中,导航到内容 > 知识库
    • 电子邮件:在 HubSpot 帐户中,导航到营销 > 营销电子邮件
  • 单击内容名称

请注意:营销电子邮件中只能添加.png、.ico、.bmp、.jpg 和 .gif 图像文件


  • 插入图片:
    • 要在富文本模块中添加图像,请单击富文本模块,然后单击富文本工具栏上的insertImage ici图像图标
    • 要在图像模块中添加图像,请单击图像模块,然后在占位符图像上方的边栏编辑器中单击 "替换 "。
  • 选择图片:
    • 要插入现有图片,请单击右侧面板中的图片
    • 要从您的电脑或通过文件 URL 上传新图片,请点击右侧面板中的添加图片。要使用 Canva 的编辑工具创建新图片,请单击使用 Canva 设计。然后点击插入图片
  • 在插入图片之前,您可以优化图片的加载时间或分辨率。 在右面板中,将鼠标悬停在图片上,然后单击详细信息
  • 然后点击图片优化 下拉菜单,选择优化选项
    • :图片将以更高分辨率加载,但加载时间会增加。
    • 默认:图像将同时优化分辨率和加载时间。
    • :图片将以较低分辨率加载,但加载时间会缩短。有关优化页面加载时间的 更多信息,请参阅我们的开发人员文档。

编辑图片

在内容中添加图片后,您可以编辑其大小、添加alt文本、添加链接或设置其加载行为。

在富文本模块中编辑图片

  • 导航至内容:

    • 网站页面:在 HubSpot 帐户中,导航到内容 > 网站页面
    • 登陆页面:在 HubSpot 帐户中,导航到内容 > 登陆页面
    • 博客:在 HubSpot 帐户中,导航到内容 > 博客
    • 知识库:在 HubSpot 帐户中,导航到内容 > 知识库
    • 电子邮件:在 HubSpot 帐户中,导航到营销 > 营销电子邮件
  • 单击内容名称
  • 在内容编辑器中,单击图片以显示图片编辑工具栏。
  • 编辑图片:
    • 要调整文字环绕图片的方式,请单击inline 对齐图标
    • 要调整图片大小,请单击宽度和高度箭头或输入像素值
    • 要调整图片周围的填充,请单击间距 下拉菜单,然后输入图片图标边缘的像素值
  • 要从富文本模块中删除图片,请单击图片,然后单击delete 垃圾桶图标
  • 要替换富文本模块中的图片,请单击图片,然后单击replace repl替换图标并添加新图片。
  • 要链接图片、添加 alt 文本或设置加载行为,请单击图片 ,然后单击铅笔图标 edit:
    • 要为图片添加链接,请单击弹出框中的 链接到 下拉菜单,然后选择链接类别在下面的字段中输入链接的目的地。进一步了解不同类型的链接
    • Alt 文本字段 中输入 文本,以便向搜索引擎和屏幕阅读器描述图片的内容。您也可以在文件工具中为图片添加alt文本。 添加alt文本将提高 网站的可访问性和搜索引擎优化。 在我们的开发人员文档中了解有关网站可访问性的更多信息。

请注意: 为图片添加 alt 文本不会添加标题文本。Alt 文本会影响搜索引擎排名和可访问性,而标题文本会在访问者将鼠标悬停在图片上时显示。

  • 要设置图片加载行为并为搜索引擎自定义图片链接类型,请单击 "高级"
    • 要设置图片加载行为,请单击图片加载 下拉菜单 并选择一个选项
      • 懒惰: 图片只在访问者到达页面的该部分时加载。这样可以缩短页面加载时间,提高搜索引擎优化效果。默认情况下,图片将在此设置下加载。
      • 浏览器默认设置: 图片加载行为由访问者的浏览器设置决定。
      • 急迫: 页面加载后立即加载图片。
    • 要自定义图片链接类型,请在链接类型 部分选择一个或多个属性
      • 常规: 此链接没有赞助。
      • 无关注:此链接与您的网站无关。
      • 赞助: 此链接是赞助链接或广告。
      • 用户生成的内容: 此链接指向用户生成的内容,如博客评论或论坛讨论。
  • 单击 "应用 "将您的更改应用到图片。

  • 要实时更新更改,请单击右上角的 "发布 更新" ,然后在对话框中单击 "发布 更新"

编辑图像模块中的图像

  • 导航至您的内容:

    • 网站页面:在 HubSpot 帐户中,导航到内容 > 网站页面
    • 登陆页面:在 HubSpot 帐户中,导航到内容 > 登陆页面
    • 博客:在 HubSpot 帐户中,导航到内容 > 博客
    • 电子邮件:在 HubSpot 帐户中,导航到营销 > 营销电子邮件
  • 单击内容名称
  • 在内容编辑器中,单击图片模块
  • 要移除当前图片,请单击侧边栏编辑器图片 部分中的移除。这将从图片模块中移除当前图片,但不会从页面中移除模块。
  • 要替换当前图片,请在侧边栏编辑器的 "图片"部分单击 "替换",然后添加新图片
  • Alt 文本字段 中输入 文本,以便向搜索引擎和屏幕阅读器描述图片的内容。您也可以在文件工具中为图片添加alt文本。 添加alt文本将提高 网站的可访问性和搜索引擎优化。 在我们的开发人员文档中了解更多有关网站可访问性的信息。

请注意: 为图片添加 alt 文本不会添加标题文本。Alt 文本会影响搜索引擎排名和可访问性,而标题文本会在访问者将鼠标悬停在图片上时显示。


  • 要在不同设备上设置图片大小,请单击 "大小 "下拉菜单并选择一个 选项
    • 自动调整:图片会根据浏览设备的大小进行缩放。
    • 精确高度和宽度:图像在所有设备上显示的大小相同。
  • 要设置图像大小限制,请单击最大尺寸 下拉菜单并选择 选项
    • 图片原始大小:图片显示的大小不会超过其原始大小。
    • 自定义:图像永远不会大于宽度 高度字段中设置的特定宽度和高度
  • 要设置图片加载行为,请单击图片加载 下拉菜单 并选择一个选项
    • 浏览器默认设置: 图片加载行为由访问者的浏览器设置决定。
    • 懒惰: 图片只在访问者到达页面该部分时加载。这样可以缩短页面加载时间,提高搜索引擎优化效果。默认情况下,图像将通过此设置加载。
    • 急切:图片会尽快加载。
  • 要为图片添加链接,请在链接(可选)字段中输入目标 URL 。选择 "在新标签页中打开链接 "复选框,引导游客在新的浏览器标签页中访问目标 URL。
  • 要实时更新更改,请单击右上角的 "发布 " "更新"

这篇文章有帮助吗?
此表单仅供记载反馈。了解如何获取 HubSpot 帮助