Como adicionar o Google Tag Manager regra de acionamento para Backbone Marionete site?

StackOverflow https://stackoverflow.com//questions/25053398

Pergunta

Eu já construiu um site com espinha dorsal marionete e agora estou tentando usar o gerenciador de tags do Google para adicionar o rastreamento.Mas eu não tenho nenhuma idéia de como configurar o GTM, a fim de ouvir mudança de página e clique no botão de evento.

Foi útil?

Solução

Os cliques são até você para ouvir eventos e controlar manualmente a partir de pontos de vista.Visualizações de página pode ser rastreado, como este:

Backbone.history.on('route', function() {
  // Send Backbone.history.fragment to your page view tracker
});

Outras dicas

Há um pouco de mexer necessária lá.Tag manager utiliza uma estrutura de dados chamada dataLayer.É uma matriz, que você pode adicionar eventos.Assim, para configurar o gestor de etiquetas, você precisa adicionar um fragmento de código no HTML da página do aplicativo, como em qualquer outro caso.No topo, você tem que inicializar o dataLayer matriz, mas você precisa ter certeza, que o código de iniciar esta variável é chamada antes de o fragmento.Então, aqui está o exemplo completo na cabeça do index.html página (em uma página de aplicativo):

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

A função de chamada loadProductDetails é um exemplo de como você empurrar os eventos para os servidores do Google - você só precisa adicionar um objeto para o dataLayer matriz.

Dan Russel escreveu um completo post de blog sobre isso, juntamente com a explicação de como configurar o macro para extrair os eventos.

E há um pouco de documentação sobre isso aqui

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top