¿Cómo comprobar que existe Data Layer de Tag Manager con la vista previa?

Hola, en este mini post se explica cómo revisar a simple vista si una Data Layer de Tag Manager está funcionando o no, utilizando la vista previa de GTM, sobre todo el menú de eventos.

¿CÓMO COMPROBAR SI LA DATA LAYER ESTÁ EN LA PÁGINA Y SE LEE BIEN?

Nos vamos a fijar para empezar SOLO en el menú izquierdo de la consola. Por supuesto, si hacemos click en el evento, y vamos a la pestaña DATA LAYER, vemos exactamente qué dataLayer se está recopilando, pero hablamos de detección rápida en primer lugar.

CÓMO SABER QUE SÍ SE INTERPRETA DATALAYER A SIMPLE VISTA

Aparece sí o sí una referencia a que existe una dataLayer en la propia vista previa de Tag Manager.

¿Dónde lo vemos? en el menú de eventos a la izquierda

¿Cómo se ve la capa de datos en el menú de eventos del debug de GTM?

Como nombre de evento (valor de la variable «event«, si la mandamos rellena en dataLayer). En este ej. pone «transaction» en el menú, y en la capa de datos pondrá también «event»: «transaction».

*aquí sí se interpreta y por ello vemos «transaction» en el menú

Como Message en el menú de eventos (en dicho menú, si hay un event en la DL, aparece su valor, si no hay event, se avisa de la DL poniendo Message). Por ej.:

CÓMO SABER QUE NO SE INTERPRETA DATALAYER A SIMPLE VISTA

Lo sabemos porque no aparece nada NUEVO en el menú de la consola (distinto a los eventos típicos que conocemos, a los eventos automáticos).
Aquí no se interpreta y no vemos nada en el menú de «eventos» en consola de tag manager:

¿CÓMO DEBUGGEAR SI LA DATA LAYER ESTÁ BIEN CON LA CONSOLA DE VISTA PREVIA?

Por ej. un caso simple en que solo es datalayer para mandar id de pedido y valor de compra.

Realizaríamos una compra de pruebas en la web con la consola abierta y después miramos en esa pestaña:

1. si los valores dinámicos corresponden bien con los que pone en la web (id de pedido y valor de compra idénticos a lo que debería poner)

2. si se ha marcado en el menú de eventos de la vista previa de GTM, nuestro event donde activar la etiqueta

{

event: transaction,

orderValue: 27,

orderId: 1245

}

Veríamos a la izquierda un punto de activación llamado transaction, al igual que vemos Pageview y los demás.

Y en la página podría justo 27 y 1245.

**NOTA FINAL: Una cuestión interesante más que me plantearon en mi curso online de Tag Manager: ¿Se supone que el «message pushed to data layer» ha de ser idéntico al «data layer value after this message»?

– message pushed to data layer (izqda en captura) >> es lo que se manda en ese punto o evento de la consola, a la capa de datos

– data layer value after this message (dcha en captura) >> es lo que queda tras actualizar con lo mandado en ese punto. ¿A qué me refiero con actualizar? pues dos cosas:

– líneas con variables «nuevas» de dataLayer, se añaden

– líneas con variables ya existentes, solo reescriben el valor de la variable «machacada»

Fijaros que la dataLayer a la derecha tiene más cosas (las que arrastraba previamente al evento Form Submit, por ej. gtm.start).

Otra diferencia pequeña de izqda a dcha: se ha agrupado en un objeto JS todo lo que empieza por gtm. y por ello a la izquierda pone gtm.element, gtm.elementClasses… y a la derecha pone gtm: {element, elementClasses,…}.

Para ver el modo en que se reemplaza el valor de una variable cuando se manda de nuevo, fijaros en que la variable «event» cambia en cada evento de la consola:

★ Si necesitas aprender Google Tag Manager y Analytics, entonces te interesa mi curso online. Consta de material PDF actualizado constantemente. Un sitio para hacer tus prácticas. Y está tutorizado por foro/email durante 2 meses (más opción a clases particulares).

O si prefieres una formación in company, en tu empresa, sobre: