跳到內容
請注意::這篇文章的翻譯只是為了方便而提供。譯文透過翻譯軟體自動建立,可能沒有經過校對。因此,這篇文章的英文版本應該是包含最新資訊的管理版本。你可以在這裡存取這些內容。

创建行动呼吁(CTA)

上次更新時間: 十一月 8, 2024

可与下列任何一种订阅一起使用,除非有说明:

行銷 Hub   Starter , Professional , Enterprise
Content Hub   Starter , Professional , Enterprise

使用行动呼吁(CTA)工具创建按钮 CTA、横幅或弹出式窗口,添加到你的 HubSpot 页面并吸引新访客。您还可以将 CTA 添加到外部页面。

在外部页面添加 CTA 之前,您必须安装HubSpot 跟踪代码,或在WordPress网站上安装HubSpotWordPress插件。添加 CTA 后,通过引导访客访问特定页面、会议链接或外部 URL 来提高流量。

在移动设备上,您可以在CTA 选项中选择启用响应式布局或在小屏幕上隐藏 CTA。发布 CTA 后,了解如何分析 CTA 的性能

设计 CTA

在 CTA 编辑器中,自定义 CTA 的设计以吸引访客。创建 CTA 时,您还可以使用智能内容,根据查看者类别显示不同版本的 CTA。了解有关在 CTA 中使用智能内容的更多信息。

  • 在你的 HubSpot 帳戶中,瀏覽「行銷」>「行動呼籲」。
  • 在右上角,单击创建
  • 在顶部,选择弹出式选项卡或嵌入和按钮选项卡。
    • 弹出式 CTA 将包括以下类型:
      • 横幅:固定在页面顶部或底部的永久性横幅。当访问者滚动浏览页面时,横幅将保持不变。
      • 弹出框: 按设定的时间表出现的弹出框。
      • 滑入式横幅:从网站一角滑入的横幅。当访问者滚动浏览页面时,横幅将保持不变。
    • 嵌入式和按钮式 CTA 包括以下类型:
      • 嵌入式:您可以在网站或 HubSpot 电子邮件中使用的横幅、号召行动或按钮,将潜在客户引向特定页面。
      • 嵌入图片:您可以在 HubSpot 页面或电子邮件中使用的图片。
  • 根据您要创建的 CTA 类型选择模板
    • 每个 CTA 模板都有可定制的元素,如图片和文本字段。
    • 例如,您可以选择 "点击聊天 "模板来启动 WhatsApp 链接,或选择 "活动"模板让游客注册会议或研讨会。
  • 在左侧面板的添加 选项卡中,为您的 CTA 添加元素并编辑布局:
    • 要为 CTA 添加更多内容,可直接点击并拖动一个新元素到编辑器的右面板。您还可以为 CTA 添加视频元素,了解更多有关为 CTA 添加视频时的选项要求。
    • 要修改 CTA 布局,请将鼠标悬停在元素 上,然后单击并拖动到新位置。
    • 要复制元素,请将鼠标悬停在元素上,然后点击duplicate克隆图标
    • 要删除元素,请将鼠标悬停在元素上,然后点击delete删除图标
    • 要编辑元素,请单击该元素。在左侧面板中,你可以编辑元素的内容和设计。

KB - CTA Drag Drop

  • 在左侧面板中,单击 "内容 "选项卡管理元素。
    • 要编辑元素,请单击元素名称 。在左侧面板中,你可以编辑元素的内容和设计。在富文本 元素中,您可以使用AI 助手 创建或完善 CTA 内容。
    • 要删除元素,请将鼠标悬停在元素上,然后点击delete 删除图标
  • 在左侧面板中,单击 "设计"选项卡,自定义并预览 CTA。
    • 要在特定页面预览 CTA,请在右上角单击 "预览"。然后,单击 "在特定页面上预览"下拉菜单,选择要预览 CTA 的HubSpot 页面
    • 要自定义 CTA 的外观,请选择以下选项之一。然后,在左侧面板中配置您的更改。
      • 位置: 对于粘性横幅 CTA,您可以选择顶部或底部位置。对于滑入式 CTA,您可以将 CTA 定位在页面的左上角、左下角、右上角或右下角。
      • 尺寸:配置 CTA 的高度,您可以切换选项,根据 CTA 的内容自动设置高度。
      • 布局: 配置 CTA 的布局。您可以为 CTA 内容添加衬垫。您还可以切换选项启用响应式布局。使用响应式布局后,CTA 的列将在小屏幕上垂直堆叠。
      • 样式: 设置 CTA 的样式,例如 CTA 的主字体、边框和下拉阴影。您可以在 CTA 中使用自定义字体,了解有关在 HubSpot 内容中使用自定义字体的更多信息。
      • 背景:为 CTA 设置背景,你可以选择设置背景颜色或上传背景图片。
      • 关闭选项:对于弹出框 CTA,您可以切换选项,允许访客在点击弹出框外的任何位置时关闭 CTA。关闭该选项后,访客只能使用关闭图标关闭 CTA。

设计 HTML CTA

创建自定义嵌入式 HTML CTA 并应用自定义主题或 CSS:

  • 在左侧面板中,单击从头开始
  • 然后,单击展开高级选项并选择嵌入式 HTML
  • 单击链接到下拉菜单,选择 CTA 重定向到的选项:
    • 电子邮件地址: 创建 mailto 链接。要在新页面中打开此链接,请选择 在新标签页中打开链接复选框。
    • 文件下载: 将您的 CTA 链接到文件管理器中的文件。选择一个现有文件或上传一个新文件,然后选择 "在新标签页中打开链接 "复选框,如果您希望点击 CTA 按钮的访客在新的浏览器窗口中查看图片的话。
    • 会议链接:将 CTA链接到 HubSpot 会议链接。单击 "选择会议链接"下拉菜单,然后选择会议链接。要在新页面中打开该链接,请选择 " 在新标签页中打开链接"复选框。
    • 你的一个页面:将你的 CTA 链接到你的一个 HubSpot 页面或博客文章。点击页面下拉菜单,然后选择页面文章。按钮 CTA 链接将与页面 ID 绑定,页面 URL 的任何更改都会自动更新按钮 CTA 链接。要在新页面中打开此链接,请选择 " 在新标签页中打开链接"复选框。
    • URL:将 CTA 链接到 HubSpot 以外的外部页面。在链接 URL字段中,输入您要引导访客访问的网站 URL。要在新页面中打开此链接,请选择 " 在新标签页中打开链接"复选框。
    • CTA:使用自定义 CTA 触发粘性横幅、弹出框或滑入式 CTA。
  • 按钮内容字段中,输入您的CTA 文本
  • 要进一步自定义 CTA 的设计,请单击高级

  • 高级 页面,您可以添加自定义 CSS 类或规则:
    • 自定义 CSS 类: 为 CTA 输入自定义类。使用自定义类可在网站的多个 CTA 中应用字体系列等设计样式。任何自定义 CSS 类都应包含在 HubSpot 页面使用的 CSS 样式表中。
    • 自定义 CSS 规则: 添加自定义规则,为您的 CTA 应用特定的内联样式。
      • 要添加新的 CSS 规则,请单击 添加一个+ 添加,然后 配置选择器和样式。
        • 选择器: 输入 CSS 选择器。此值为可选项,将与 CTA 的选择器相结合。例如,如果输入的选择器是:hover ,组合后的选择器就会变成${ctaSelector}:hover
        • 样式: 输入应用于已配置选择器的自定义 CSS 样式规则。您可以输入样式而不输入选择器。例如,color: yellow;

  • 要编辑现有 CSS 规则,请将鼠标悬停在该规则上,然后点击edit edit 图标
  • 要克隆 CSS 规则,请将鼠标悬停在该规则上,然后单击duplicate 克隆图标
  • 要管理 CSS 规则的优先级,请单击并拖动每条 规则,按优先级排列。
  • 要删除 CSS 规则,请将鼠标悬停在该规则上,然后单击delete 删除图标
  • 要在 CTA 上应用与传统 CTA 相同的 HTML 和类,请选择 "使用传统标记"复选框。如果页面上有为传统 CTA 定义的 CSS 样式表,选择此复选框将允许 HTML CTA 采用相同的样式。
  • 要完成 CTA 设计的设置,请单击保存并应用。

自定义粘贴横幅、弹出框或滑入式 CTA 的显示位置和时间

如果您设置了粘贴横幅、弹出框或滑入式 CTA,请选择该 CTA 在网站上的显示时间,从而锁定访客。了解有关在页面中添加 CTA 的更多信息。

您可以使用筛选器来组合多套有关哪些访客会看到您的 CTA 的规则。了解有关配置目标定位规则的更多信息。

激活触发器

选择激活触发器,以确定 CTA 何时显示在页面上。一旦满足第一个选定的触发器,CTA 就会显示。

  • 在顶部,单击 "定位 "选项卡。
  • 在 "何时显示"部分,单击以切换要使用的激活触发器旁边的开关
    • 点击按钮时触发:访客点击按钮时将显示 CTA。了解如何设置弹出式 CTA 在按钮点击时触发。默认情况下,此选项始终打开。
      • 使用默认按钮模块在 HubSpot 页面中配置此选项,或通过自定义按钮类别在外部页面中配置此选项。
      • 要在外部页面设置该触发器,必须安装HubSpot 跟踪代码
    • 页面滚动时触发:当访问者滚动页面超过指定百分比时,CTA 将出现。
    • 退出时触发:当访问者将光标移动到浏览器窗口顶栏时,CTA 将出现。
    • 经过时间后触发: CTA 将在指定秒数后出现。
    • 不活动后触发:CTA 将在访客不活动指定秒数后出现。

网站 URL

在同一个"目标定位 "选项卡中为特定网页 URL 或查询参数值添加条件逻辑。默认情况下,CTA 将出现在所有页面上。

  • 要在访客访问特定网站 URL 时显示 CTA,请在网站 URL 部分
    • 单击第一个下拉菜单 ,选择网站 URL
    • 单击第二个下拉菜单 ,选择目标定位规则
    • 在文本字段中输入规则标准
  • 要在访客访问 URL 包含特定查询参数的网站页面时显示 CTA,请执行以下操作
    • 点击第一个下拉菜单 ,选择查询参数。
    • 在第一个文本字段中输入 查询参数名称
    • 单击第二个下拉菜单,选择目标定位规则
    • 在第二个文本字段中,输入查询参数值
  • 要添加其他规则,请单击添加规则
  • 要从某些页面排除行动呼吁,请单击 添加排除规则。例如,您可能希望为隐私政策页面添加排除规则。

访客信息和行为

您还可以在 "定位 "选项卡中根据已知的游客信息和行为定位特定联系人。您可以添加的过滤规则类型取决于您的账户订阅。

  • 要向指定网站上的所有访客显示 CTA,请选择所有访客。默认情况下选择此选项。
  • 要向特定访客显示 CTA,请单击过滤访客 选项。然后,设置筛选器:
    • 单击第一个下拉菜单,选择如何过滤访客。
    • 点击下一个下拉菜单,选择过滤规则
    • 要为何时显示 CTA添加 更多规则,请单击添加规则 并选择筛选器。
    • 选择何时隐藏 CTA:
      • 单击添加排除规则
      • 单击第一个下拉菜单,选择何时隐藏 CTA。
      • 单击下一个下拉菜单,选择过滤规则
      • 要为何时隐藏 CTA 添加更多规则,请单击添加排除规则并选择过滤规则
    • 要创建另一组过滤规则,请单击添加过滤组并 选择过滤规则。



显示频率

在访客首次取消粘贴横幅、弹出框或滑入式 CTA 后,选择是否再次显示 CTA 以及显示频率。在 "目标定位 "选项卡中,设置 CTA 的显示频率:

  • 在 "多久显示一次 "部分,单击 "再次显示 "下拉菜单并选择频率:
    • 设定时间段后:设定访客取消 CTA 后再次显示 CTA 的时间。
    • 重复:每次访问所选网页并执行触发操作时都显示 CTA,即使之前已与之互动过。
    • 不再显示:只向访客显示一次 CTA。首次显示后,不再显示 CTA。

请注意: 不适用于使用点击按钮触发器 作为 激活触发器的 CTA。


自定义 CTA 选项

在 "选项 "选项卡上,自定义不同的 CTA 选项,如是否在小尺寸上显示 CTA、任何相关的营销活动以及 CTA 的时间安排。

  • 在顶部,单击选项 选项卡。
  • 对于粘性横幅、弹出框或滑入式 CTA,您可以在小尺寸屏幕上隐藏 CTA。在 "小屏幕尺寸"部分,选择 "在小屏幕尺寸上关闭"复选框。
  • 如果您订阅了Marketing Hub专业版 企业版,则可以将 CTA 与营销 活动相关联:
    • 要将 CTA 与现有广告系列关联,请单击广告系列下拉菜单并选择一个广告系列
    • 要将 CTA 与新广告系列关联,请单击广告系列下拉菜单并单击创建广告系列。然后,继续设置您的广告系列
    • 如果以前从未创建过广告系列,请单击创建广告系列。然后,继续设置广告系列
  • 配置如何跟踪 CTA 点击。从以下选项中选择:
    • 通过重定向跟踪点击:在将访问者重定向到最终页面之前,通过将访问者引导到初始 URL 跟踪对 CTA 的点击,该 URL 会将点击与 CTA 关联起来。默认情况下选择此选项。
    • 通过浏览器跟踪点击:通过访客的浏览器异步跟踪点击。此选项允许您使用锚标签,因为没有重定向,CTA 将引导访客访问设定的 URL。
  • 对于粘性横幅、弹出框或滑入式 CTA,您可以安排 CTA 的显示时间:
    • 要安排 CTA 开始显示的时间,请打开 "稍后安排"开关。然后,选择开始日期时间
    • 要安排 CTA 停止显示的时间,请打开 "设置取消发布日期和时间 "开关。然后选择结束日期 时间


发布 CTA

完成 CTA 设置后,发布 CTA,使其生效。

  • 在右上角,单击审核并发布
  • 在右侧面板中,审核您的 CTA,然后点击立即发布。CTA 将自动发布到目标页面。
這篇文章有幫助嗎?
此表單僅供記載意見回饋。了解如何取得 HubSpot 的協助