如何将Active Campaign的事件追踪脚本添加到Squarespace网站？

前置准备 #

• 登录你的Active Campaign后台，获取专属的事件追踪密钥（key）和账户ID（actid），你拿到的示例代码中的对应值为演示数据，必须替换为你自己的参数才能使用
• 确定你要追踪的事件名称，例如「表单提交」「商品加购」「资料下载」，后续配置会用到

站点配置步骤 #

步骤1：添加全局基础追踪代码 #

• 登录Squarespace后台，依次进入「设置」→「高级」→「代码注入」，找到*页脚（Footer）*代码输入框
• 把下面的代码粘贴进去，先替换代码里的你的actid值、你的事件追踪key值为你自己的Active Campaign参数：

<script>
function trackACEvent(eventName, eventData = '', userEmail = '') {
  // 替换为你自己的Active Campaign参数
  const actid = '你的actid值';
  const trackKey = '你的事件追踪key值';
  
  // 构造上报数据
  const postData = new FormData();
  postData.append('actid', actid);
  postData.append('key', trackKey);
  postData.append('event', eventName);
  postData.append('eventdata', eventData);
  postData.append('visit', JSON.stringify({email: userEmail}));
  
  // 发送追踪请求
  fetch('https://trackcmp.net/event', {
    method: 'POST',
    body: postData
  }).then(res => res.json()).then(data => {
    if (data.success) console.log('事件追踪成功:', data.message);
    else console.error('事件追踪失败:', data.message);
  }).catch(err => console.error('请求出错:', err));
}
</script>

• 点击保存配置。

步骤2：给具体交互绑定追踪事件 #

以下是2个常用场景的配置方法，你可以按需选择：

场景1：追踪按钮点击事件

• 进入你要加追踪的页面，编辑对应按钮的设置，找到「点击」动作的自定义代码配置项
• 粘贴下面的代码，替换括号内的内容为你自己的配置：

trackACEvent('你定义的事件名', '可选的事件补充信息', '如果能拿到用户邮箱可以填这里');

• 保存页面设置即可。

场景2：追踪表单提交事件

• 编辑Squarespace表单，找到「提交后」的自定义脚本配置项
• 粘贴上面的触发代码，事件名可以设为表单提交，事件数据可以填表单的名称，用户邮箱可以用Squarespace表单的内置变量{email}自动获取提交者的邮箱。

配置验证 #

• 打开你配置了追踪的站点页面，按下F12打开浏览器开发者工具，切换到「控制台（Console）」标签
• 触发你配置的交互（比如点击按钮、提交测试表单），如果控制台输出事件追踪成功的提示，就代表配置正常
• 你也可以登录Active Campaign后台，进入事件追踪页面，查看事件是否正常上报。

内容的提问来源于stack exchange，提问作者Edith Olasanya