dataLayer.push 在 GTM 脚本后不起作用 [英] dataLayer.push not working after GTM script

查看:42
本文介绍了dataLayer.push 在 GTM 脚本后不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I want to implement the Enhanced Ecommerce with Google Tag Manager and I want to push some data for the tag Universal Analytics.

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

I have always created the dataLayer before the GTM script, but now I need to send more data with dataLayer.push

而且它不起作用,datalaLayer.push 仅在 GTM 脚本开始之前发生时才起作用.

And it doesn't work, datalaLayer.push only works if it happens just before the GTM script starts.

示例.这有效:

   <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>

但是如果我在 GTM 脚本不起作用后使用 dataLayer.push,则不会发送任何数据,也不会报告任何错误.

But if I use dataLayer.push after the GTM script does not work, no data is sent and no errors are reported.

这对我不起作用:

<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 之后添加类似的初始化调用,但它会中断.
  • Always use .push instead of initialization: your first call is an array initialization (dataLayer = []). This means that if the dataLayer already exists, it will be completely overwritten, including the .push method which is customized by GTM in order to receive pushed events. Right now it's working fine because you're calling GTM after the initialization. But it's a bad habit to take. One day you will move GTM above that initialization or add similar initialization calls after GTM, and it will break.

您的电话应该是:

window.dataLayer = window.dataLayer || [];  
dataLayer.push({...});

  • 始终设置 event 属性:event 属性是 GTM 用来定义触发器和了解数据何时可用的属性.您可以有 2 个连续的 .push 调用,第一个带有 event,第二个没有,第一个的数据将在第二个可用(只要推送不会覆盖它),但这又是一个坏习惯,是玩火.
    • Always set the event property: the event property is what is used by GTM to define triggers and know when data becomes available. You can have 2 successive .push calls, the 1st with an event, and the 2nd without, and the data from the 1st will be available in the 2nd (as long as that push doesn't overwrite it), but once again that's bad habit and playing with fire.
    • 例如:

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

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

      In your particular case, since the event key is missing, it works as long as GTM loads after the push, because the data is already there when GTM kicks in. When the push call is moved after GTM, because there is no event property, there is just no way for GTM to know when data becomes available. So you should:

      • 添加 event 键(总是!)
      • 配置匹配event
      • 的触发器
      • Add the event key (always!)
      • Configure a trigger which matches the event

      这里有一些关于这些主题的更多阅读:

      Here is some more reading on those topics:

      这篇关于dataLayer.push 在 GTM 脚本后不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆