How to add Google Tag Manager firing rule for Back

2019-08-31 03:13发布

I have already built a site with backbone marionette and now I am trying to use Google Tag manager to add the tracking. But I have no idea how to configure GTM, in order to listen page change and button click event.

2条回答
干净又极端
2楼-- · 2019-08-31 03:38

There is a bit of fiddling required there. Tag manager uses a data structure called dataLayer. It's an array, that you can add events to. So to configure tag manager, you need to add a snippet to HTML page of the application as in any other case. On top of it, you have to initialise the dataLayer array but you need to make sure, that the code initialising this variable is invoked before the snippet. So here is the full example in the head of the index.html page (in one page app):

<html>
<head>
... 
<script>
  dataLayer = [];
</script>
<script>
function loadProductDetails(productIdentifier) {
dataLayer.push({
  'event':'pageview',
  'virtualUrl':'/product/'+productIdentifier 
});
// code to load product details and display to user
}
</script>
</head>
<body>
<!-- Google Tag Manager -->
<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-3VLTP"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<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=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-3VLTP');</script>
<!-- End Google Tag Manager -->
...
<a onclick="loadProductDetails('nexus7');">Nexus 7</a>
...
</body>
</html>

The function called loadProductDetails is an example on how you push the events to Google servers - you just need to add an object to the dataLayer array.

Dan Russel wrote a full blog post about it, together with explanation how to setup the macro for extracting the events.

And there is a bit of documentation on this as well here

查看更多
姐就是有狂的资本
3楼-- · 2019-08-31 03:43

Clicks are up to you to set up listening events and track manually from views. Page views can be tracked like this:

Backbone.history.on('route', function() {
  // Send Backbone.history.fragment to your page view tracker
});
查看更多
登录 后发表回答