Shopify里跟踪Klaviyo Form表单跟踪

Google Analytics 4 Haran 9年前 (2016-06-10) 7892次浏览 0个评论

更新时间:2025年3月14号

这一篇介绍如何在Shopify里跟踪Klaviyo Form表单跟踪。

  • 如果你是已经在theme.liquid里安装GTM,那么可以直接做跟踪,延伸阅读:Google Analytics 4 上对Klaviyo Form表单做跟踪
  • 如果你只是在Custom Pixel里安装的,那么跟踪思路是:在theme.liquid里监听Klaviyo,转为Shopify analytics事件,再到Custom Pixel里转为dataLayer.push发送。

这一篇介绍的是第二种情况的。

Step 1:theme监听Klaviyo事件

在主题里面找到theme.liquid,添加如下代码:

<script>
  window.addEventListener("klaviyoForms", function(e) { 
    if (e.detail.type == 'submit') {
      Shopify.analytics.publish('klaviyo_forms', {
        'form_id' : e.detail.formId,
    	'form_title' : e.detail.metaData.$source
      });
    }
  });
</script>

 

Step 2:Custom Pixel里发送事件

在Custom Pixel里的GTM代码里添加如下代码:

analytics.subscribe("klaviyo_forms", (event) => {
  window.dataLayer.push({
    event: "klaviyo",
    form_id: event.customData.form_id,
	form_title: event.customData.form_title
  });
});

延伸阅读:Shopify中用Custom Pixel安装Google Analytics 4

Step 3:GTM配置

设置触发器

在GTM中点击「代码」——「新建」——「选择一个触发器类型以开始设置…」——「自定义事件」,命名为Custom Event- Klaviyo Forms Submit Form,做如下设置:

设置变量

在GTM中点击「代码」——「新建」——「选择一个变量类型以开始设置…」——「数据层变量」,命名为dlv_formid,做如下设置:

同理设置dlv-formtitle。

设置代码

在GTM中点击「代码」——「新建」——「选择一个代码类型以开始设置…」——「Google Analytics:GA4 事件」,命名为“GA4-Event-Klaviyo Forms Submit Form”,然后做如下设定:

Step 4:测试

最后就是测试,由于Custom Pixel是在Sandbox里,具体测试方法,请看:Shopify中用Custom Pixel安装Google Analytics 4


如有疑问,可以在文章底部留言或邮件(haran.huang@ichdata.com) 我~
喜欢 (0)
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址