标签: google-tag-manager

如何使用Google跟踪代码管理器(像素容器)与使用Floodlight代码不同？

跟踪代码管理器实际上是一个可以根据需要加载自定义跟踪代码的容器,而Floodlight代码则跟踪代码.但据我所知,自定义标签的负载可以通过泛光灯本机完成,通过使用他们所谓的"动态"标签.

Floodlight动态代码
Google跟踪代码管理器

干杯!

摘要

随着时间的推移,Google跟踪代码管理器dataLayer会被规则和标记过于复杂,特别是在AJAX密集的网站上.

题

我正在一个跟踪繁重的网站上实施GTM,并寻找以下问题的清洁解决方案.我将以Google Analytics为例.

它允许您设置和使用4个宏进行事件跟踪:

• 类别{{ga event category}}
• 行动{{ga event action}}
• 标签{{ga event label}}
• 价值{{ga event value}}

值和标签是可选的,但dataLayer是持久的,不是吗？那么我该如何处理以下场景:

dataLayer.push({
  'event':'gaEvent', 
  'gaEventCategory':'my-category', 
  'gaEventAction':'my-action',
  'gaEventLabel':'my-label',
  'gaEventValue':'my-value'
});

但是后来在同一页面上我必须跟踪另一个事件,但是没有Label和Value:

dataLayer.push({
  'event':'gaEvent', 
  'gaEventCategory':'another-category', 
  'gaEventAction':'another-action',
});

如果我设置了一个类似"Event is gaEvent"的规则,那么我会关闭"Google Analytics"标记,该标记如下所示(此处使用HTML标记而不是内置标记):

<script type="text/javascript">
  _gaq.push(['_trackEvent', '{{ga event category}}', '{{ga event action}}', '{{ga event label}}',  {{ga event value}}]);
</script>

第二个事件将被推到_gaq前一个事件的标签和值.

如何处理这类案件？

对于那些想知道的人,我需要能够在某些点触发同一事件上的不同标签,这就是为什么我想要这种"动态"解决方案,但是dataLayer像那样持久化会搞乱规则.

编辑1:测试例程

这是我测试这个的方法.

• 我在Chrome中安装了Google Analytics Debugger
• 我在调试模式下有GTM
• 加载站点后,在控制台中,我将从描述中执行第一次dataLayer推送
• 我从GA Debug输出中看到GA事件是用4个值触发的
• 我从控制台进行第二次推送
• GA Debug输出告诉我GA事件是使用新的类别和操作触发的,但是先前已推送标签和值

这就是我所说的持久性.为了避免这个,我只能拿出不同的事件类型,如gaCustomEvent,gaCustomEventWithLabel,gaCustomEventWithOption等等,然后规则和标签,对于那些每一个.那太荒谬了,你不同意吗？

我设置了新的通用分析跟踪,并希望将ClientID存储在其中一个自定义维度位置中.

跟踪代码是通过Google跟踪代码管理器(使用预定义的UA代码)实现的,我很难通过基本的网页浏览请求传递客户端ID(通过自定义JavaScript宏).

我已经命名了我的跟踪器,以便我可以访问它,并且此代码在控制台中运行时没有任何错误,但是当与GTM一起使用时,它会返回错误.

ga.getByName('trackerGTM').get('clientId'))

产生错误:

Uncaught ReferenceError: ga is not defined

有小费吗？

这是我的dataLayer数组：

dataLayer = [{
  'giftBatch' : {
    'giftID': '',
    'giftAmount': 0,
    'giftCount': 0,
    'giftUpdate': {
      'giftPhase': 'Gift Empty'
    }
  },
  'txBatch': {
    'txID': '',
    'txTotal': 0,
    'txURL': window.location.href,
    'txUpdate': {
      'txPhase': 'Transaction Opened',
      'txT0': new Date(),
      'txT1': ''
      'txT2': ''
    }
  }
}];

控制台结果为：Array [Object1]

根据需要，Object1包含“ giftBatch”和“ txBatch”对象。

我有一个触发器，稍后触发以更新dataLayer中的对象。

例如，将“ giftAmount”更新为50，将“ giftCount”更新为1。

我尝试了以下方法（我仅展示了一次修改“一个对象”的失败尝试），

尝试1：

dataLayer.push({giftAmount : 50});

结果：

数组[object1，object2]

Object1与上面相同，

Object2是一个新对象，其属性为'Gift Amount'：50，

尝试2：

dataLayer.push({giftBatch.giftAmount: 222});

结果： SyntaxError：缺少：属性ID之后

尝试3：

dataLayer.push({'giftBatch.giftAmount' : 50});

结果：

数组[object1，object2]

Object1与上面相同，

Object2是一个具有'giftBatch.giftAmount'属性的新对象：50 …

是否可以使用网络访问者的位置作为触发条件从Google跟踪代码管理器中触发代码？我要问的是要触发欧盟Cookie通知的问题，但是只有来自欧盟的访问者才能看到。

理想情况下，我将能够在GTM中进行设置。如果可能的话，有人可以解释如何做吗？

非常感谢！

如何更改使用Google跟踪代码管理器时发送到Universal Google Analytics的网页网址？没有Google跟踪代码管理器,它非常简单.你只需要添加ga('set', 'page', '/my/custom/url');之前ga('send', 'pageview');.

您的Google Analytics脚本必须如下所示:

<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

      ga('create', 'UA-XXXXXXXX-X', 'auto');
      ga('set', 'page', '/my/custom/url'); /* Set my custom URL */
      ga('send', 'pageview');

</script>

如何使用Google跟踪代码管理器执行类似的操作？

以前我是使用react-ga npm模块在下一个js应用中插入Google Analytics（分析）。就像这样：

import ReactGA from 'react-ga'

export const initGA = () => {
  ReactGA.initialize('UA-*******-*', {
    titleCase: false
  })
}

export const logPageView = () => {
  if (window.location.href.split('?')[1]) {
    ReactGA.set({page: window.location.pathname + '?' + window.location.href.split('?')[1]})
    ReactGA.pageview(window.location.pathname + '?' + window.location.href.split('?')[1])
  } else {
    ReactGA.set({page: window.location.pathname})
    ReactGA.pageview(window.location.pathname)
  }
}

然后我在标头（插入到应用程序的每个页面）中调用logPageView函数，如下所示：

  componentDidMount () {
    if (!window.GA_INITIALIZED) {
      initGA()
      window.GA_INITIALIZED = true
    }
    logPageView()
  }
  componentWillReceiveProps () {
    if (!window.GA_INITIALIZED) {
      initGA()
      window.GA_INITIALIZED = true
    }
    logPageView()
  }

现在，我想使用Google跟踪代码管理器来处理Google Analytics（分析）页面视图。我该怎么办？

我正在使用Google跟踪代码管理器来提供Facebook Pixel.

然后,我使用这样的代码激活事件

  <body>
...
        <script>
            fbq('track', 'ViewContent', { 
                content_type: 'product',
                content_ids: ['1234'],
                content_name: 'ABC Leather Sandal',
                content_category: 'Shoes',
                value: 0.50,
                currency: 'USD'
            });
        </script>
    </body>

但是当代码执行时我得到了一个错误,因为Facebook Pixel是异步加载的,而fbq还没有.

未捕获的ReferenceError:未定义fbq

我该怎么办？

我想使用Google跟踪代码管理器来投放Adsense,因此我也可以使用其他来源的其他广告.我在网站上找到的答案很少,但还不足以理解.如果可以在GTM中使用Adsense代码,我将不胜感激,如果是,如何？如果我必须使用DFP广告管理系统,那么我也会使用DFP广告管理系统.

我正在尝试在React网站上安装Google跟踪代码管理器，但是当我阅读Google跟踪代码管理器的文档时，它表明我应该在每个页面的头部和正文中粘贴一个长脚本标记：

<!-- Google Tag Manager -->
<script>(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-XXXX');</script>
<!-- End Google Tag Manager --> 

但是，React站点传统上不使用script标签。如何通过Google跟踪代码管理器有效，高效地设置我的React网站？SPA是否有特殊的React或JavaScript标签？