dataLayer.push GTM 脚本后不工作

dataLayer.push not working after GTM script

我想使用 Google 标签管理器实施增强型电子商务,我想为标签 Universal Analytics 推送一些数据。

我一直在 GTM 脚本之前创建数据层,但现在我需要使用 dataLayer.push

发送更多数据

而且它不起作用,datalaLayer.push 只有在 GTM 脚本启动之前才起作用。

例子。这有效:

   <script>
    <head>
     dataLayer = [{   
                 
            'google_tag_params': {
               'ecomm_pagetype': 'category',
               'ecomm_category': '{{ $resource->seo->h1 }}',
             }
         }];
    
    dataLayer.push({
              'ecommerce': {
                'currencyCode': 'EUR',    
                'impressions': [
                     {
                        'id':       '12312',
                        'price':    24,
                        'category': 'wfwefwerwerwer',
                        'position': 2,
                        'name':     'wfwefwerwerwer',  
                        'brand':   'My Brand',
                        'list':    'Product List',
    
                    }
                ]
              }
            });
    
    (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
    })(window,document,'script','dataLayer','GTM-XXXXXX');
    
    </script>
    </head>

但是如果我使用dataLayer.push后GTM脚本不起作用,没有发送数据也没有报错。

这对我不起作用:

<head>
    <script>
         dataLayer = [{   
                     
                'google_tag_params': {
                   'ecomm_pagetype': 'category',
                   'ecomm_category': '{{ $resource->seo->h1 }}',
                 }
             }];
        
        
        (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
        new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
        j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
        'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
        })(window,document,'script','dataLayer','GTM-XXXXXX');

    </script>
</head>

<body>

    //something content html here

    <footer></footer>

    <script>
        dataLayer.push({
          'ecommerce': {
            'currencyCode': 'EUR',    
            'impressions': [
                 {
                    'id':       '12312',
                    'price':    24,
                    'category': 'wfwefwerwerwer',
                    'position': 2,
                    'name':     'wfwefwerwerwer',  
                    'brand':   'My Brand',
                    'list':    'Product List',

                }
            ]
          }
        });
    </script>
</body>

你没有遵循最佳实践,所以你迟早会运行陷入问题

  • 始终使用 .push 而不是初始化 :您的第一个调用是数组初始化 (dataLayer = [])。这意味着如果dataLayer已经存在,它将被完全覆盖,包括GTM为了接收推送事件而定制的.push方法。现在它工作正常,因为您在初始化后调用 GTM。但这是一个坏习惯。有一天你将 GTM 移到该初始化之上或在 GTM 之后添加类似的初始化调用,它就会崩溃。

你的电话应该是:

window.dataLayer = window.dataLayer || [];  
dataLayer.push({...});
  • 始终设置 event 属性event 属性 是 GTM 用来定义触发器和知道数据何时可用。您可以有 2 个连续的 .push 调用,第一个带有 event,第二个没有,并且来自第一个的数据将在第二个中可用(只要该推送不会覆盖它), 但这又是个坏习惯和玩火。

例如:

dataLayer.push({
  'event': 'ecommerce', // naming is up to you, should match your GTM triggers 
  'ecommerce': {
  ...

在您的特定情况下,由于 event 密钥丢失,只要 GTM 在推送后加载,它就可以工作,因为当 GTM 时数据已经存在启动。当 push 调用移到 GTM 之后时,因为没有 event 属性,GTM 无法知道数据何时可用。所以你应该:

  • 添加 event 键(总是!)
  • 配置匹配 event
  • 的触发器

以下是关于这些主题的更多阅读材料: