使用 GTM 跟踪 Calendly 预订软件

Mon 22 Sep 2025

135 views

Calendly 不仅仅是一个日程安排工具——它还是一个强大的数据驱动型表单解决方案。在各类服务型企业中被广泛使用，随着组织越来越重视无缝的客户互动，它的全球普及度正在不断提升。在当今时代，数据是企业增长最有价值的资产。如果没有适当的跟踪与分析，就很难真正了解潜在客户是如何与您的服务进行互动的。

通过将 Calendly 与分析和营销平台集成，企业可以获得关于客户行为、转化率以及整体流量互动的可操作性洞察。这不仅有助于优化客户旅程，还能确保营销投资是基于真实数据，而不是依赖猜测。

真正的挑战在这里出现了。使用 Google Tag Manager (GTM) 跟踪 Calendly 表单并不简单，因为 Calendly 运行在 iframe 中。与常规表单不同，iframe 不允许直接访问表单提交数据，这使得传统的跟踪方法无效。

为了解决这一限制，我们需要实现一个事件监听器 (event listener)，它可以捕捉 Calendly iframe 内的交互并将其传递到 GTM。这种方法能够确保您准确跟踪表单提交、用户互动以及其他关键转化事件。

使用 Google Tag Manager 跟踪 Calendly 表单

跟踪 Calendly 表单的第一步是在 Google Tag Manager 中创建一个自定义标签 (Custom Tag)，作为监听器。这个监听器负责在表单提交时捕获数据。

操作步骤如下：

登录您的 GTM 账户并创建一个新标签。
在标签类型选项中，选择 Custom HTML。
将监听器代码粘贴进去。
将触发器分配为 All Pages，这样监听器就能在整个网站运行。

<script>

window.dataLayer = window.dataLayer ||[];

window.addEventListener('message',

 function(e) {

 if (e.data.event && e.data.event.indexOf('calendly') === 0) {

window.dataLayer.push({

 'event' : 'calendly',

 'calendly_event' : e.data.event.split('.')[1]

 });

 }

 }

);

</script>

随着监听器 (listener) 设置完成，现在可以无缝跟踪 Calendly 表单上的每一次互动。从这一刻起，每当访客与表单进行交互时，监听器都会自动捕获这些行为，并将信息推送到数据层 (data layer)。

这意味着，所有相关事件和提交详情都可以在 Google Tag Manager 中进行跟踪与分析。既然监听器已经激活，下一步就是探索数据层，以验证事件是否被正确记录。

在这里，您可以看到自定义 HTML 监听器是如何将数据推送到数据层的。不要被这些数据的格式弄混淆——一开始看起来可能有些复杂。实际上，我们只需要关注两个与 Calendly 表单提交跟踪相关的特定 dataLayer 变量。

您可能还会注意到一些额外的 dataLayer 变量（例如 “page height”）被触发，但这些对我们的目的没有价值，可以放心忽略。

“page_height” 只是随事件发送的一条额外信息，用来告诉 GTM 页面高度。

在这个阶段，我们需要使用 数据层变量 (data layer variables)，而不是直接依赖事件。原因是：同名事件可能会被多次触发，这会导致难以准确识别我们真正需要的那个。

在所有数据层输出中，有两个变量尤其重要：

date_and_time_selected —— 捕捉用户在预约时选择的日期和时间。
event_schedule —— 记录用户成功预约事件的确认信息。

我们的目标是从数据层中提取这两个变量，并将它们用于精确跟踪。
要实现这一点，我们首先需要在 GTM 中创建一个 用户自定义变量 (User-Defined Variable)。通过这样做，我们就能访问这些数据层的值，并基于它们精准地设置触发器。

在 Google Tag Manager 中设置数据层变量

打开 Variables（变量） 部分。
在 User-Defined Variables（用户自定义变量） 下创建一个新变量。
选择 Data Layer Variable 作为变量类型。
输入变量名称 “calendly_event”。
保存配置。

这个单一变量将帮助我们动态收集目标的两个变量。

最后也是最重要的数据层变量是 “event_schedule”。
在大多数情况下，这个变量是跟踪 Calendly 表单提交的主要变量，因为用户提交表单后，它会立即被推送到数据层。
如果您觉得跟踪 “date_and_time_selected” 有价值，也可以将其包含，但根据需求，这个变量是可选的。

我们的动态变量已准备就绪，下一步是设置最终触发器，以便准确捕捉这些事件。