VARIABLES DE TAG MANAGER Y MEDICIÓN DE EVENTOS DE ANALYTICS

Las variables de Google Tag Manager almacenan datos (dinámicos o estáticos), son partes específicas de información de la web y de las interacciones que realizamos en ella, o valores necesarios para las propias etiquetas que vamos creando.

Su utilidad es fundamental cuando queremos recopilar valores de la página o eventos, cuando deseamos crear un activador con condiciones – por ej. para un botón concreto, para una sola página… -, cuando queremos modificar otras variables incluso…

Las variables en Tag Manager tienen una función similar a la que tienen en programación, es decir, sirven:

• para llamar a valores fijos almacenados (ID de Google Ads), o  que son calculados en tiempo real (URL de página actual, o texto enlace clicado),
• para cargar valores dinámicos de la página,
• para trabajar con ellos.

Antes de los gestores de etiquetas todo se hacía con programación. Y a los de marketing esto nos resultaba algo totalmente ajeno.

Si queremos utilizar Tag Manager, 
hemos de aprender de código,

data layer de Google Tag Manager,

una forma de rellenar valores dinámicos y datos, enviarlos a GTM, y de ahí a Analytics u otras herramientas. 

Me explico mejor ahora, si quiero saber qué enlace se ha clicado, necesito recopilar algo sobre él: su anchor text o texto del link, la dirección donde apunta, etc. Una opción es trabajar directamente con código de capa de datos o datalayer, y otra  muy óptima en muchos casos es automatizar eventos con las propias variables de Tag Manager.

Cuando hablamos de automatización de eventos mediante Tag Manager no nos referimos a medir cada link por separado como se hacía antes, sino a medir todos de golpe. Otro ejemplo concreto que vamos a ver: cuando queremos medir un click específico, necesitamos identificarlo y diferenciarlo de los demás enlaces o botones, ¿y cómo lo hacemos? pues precisamente con variables. Ahora lo veremos :)

Antes:

MEDICIÓN DE EVENTOS DE GOOGLE ANALYTICS CON CÓDIGO JAVASCRIPT

ga('send', 'event', [eventCategory], [eventAction], [eventLabel], [eventValue], [fieldsObject]);

Por ej.

 ga('send', 'event', Interacción, Click Botón, Click Botón Compra)

Lo mismo es aplicable si usamos gtag, aunque con la importante ganancia de que ya hay nombres «sugeridos» para eventos:

gtag('event', <action>, {
  'event_category': <category>,
  'event_label': <label>,
  'value': <value>
});

Por ej.

 gtag('event', Click Botón, {
  'event_category': Interacción,
  'event_label': Click Botón Compra
});

Seguimiento de eventos de Google Analytics con (gtag.js) >

Seguimiento de eventos de Google Analytics (analytics.js) >

Así se marcaba cada botón importante, por separado. O si se hacía con una mayor automatización ya se dependía 100% del código que nos programaran quienes desarrollaban la web. Estaba en su mano el automatizar y hacer código limpio, o no hacerlo.

Nosotros pasábamos ese código o una serie de códigos similares a desarrollo, y desde ahí decidían cómo incluirlo, más manualmente o con JS en archivo externo.

Ahora

MEDICIÓN DE EVENTOS DE GOOGLE ANALYTICS CON TAG MANAGER: EVENTOS AUTOMÁTICOS

UNA ETIQUETA PARA GOBERNARLOS A TODOS… :D

La operativa con Google Tag Manager es muy distinta. Primero buscamos un atributo que detecte o diferencie  ese botón e idealmente también otros similares. Creamos un activador para dichos botones, que funcione con todos a la vez; o varios activadores de ser necesario.

Y en la etiqueta es donde echamos el resto al configurar los atributos del evento Click en Botón.
Por ej.

Categoría - Interacción
Acción - Click Botón
Etiqueta - Click Botón + Magia de código

¿Y quién hace esa magia de código o programación? Pues la más clave ya la hecho Tag Manager, se llaman Variables Predefinidas o Built-In Variables.

Las variables para los principales tipos de activación ya las ha generado Tag Manager por defecto. Las encontramos en en el menú de Variables, y podemos activarlas así, por ej. las variables predefinidas clave de Click sería así:

Cada vez que medimos un tipo de acción diferente debemos marcar sus variables predefinidas para tenerlas a nuestra disposición cuando necesitemos, bien sea para usarlas en activadores, para etiquetas, o incluso para otras variables.

Sigamos con el ejemplo del click…
¿Cómo sabemos el texto del enlace donde se clica? Con {{Click Text}}.
¿Cómo sabemos la dirección a la que apunta y dirige al usuario al hacer click? Con {{Click URL}}.

Querido marketiniano, bienvenido al nuevo mundo, ya no debes depender para todo de programación en la página, pues Google Tag Manager ya recopila muchos datos dinámicos automáticamente.

Según nuestra conveniencia, ya podemos configurar así:

Categoría - Interacción 
Acción - Click Botón 
Etiqueta - Click Botón: {{Click Text}}

O así:

Categoría - Interacción
Acción - Click Botón
Etiqueta - Click Botón: {{Click Text}} - {{Click URL}}

VARIABLES EN ACTIVADORES TAG MANAGER

¿Y para qué más usamos las variables aparte de para las etiquetas? Para poder filtrar en los activadores y definir exactamente qué botón/es queremos medir, y también cuáles no.

Primero elegimos el tipo de evento, en este ejemplo, sería de click, si es click en un elemento HTML  <a href…> sería de tipo «Solo enlaces»; si no, elegiríamos «Todos los elementos».

Ejemplo de Activador: 

Tipo de activador - Click Solo Enlaces
Todos o Algunos - Algunos
Condición - Click Classes contiene btn-success
Condición - Page Path regEx checkout|contact|subscription

Aquí deberemos haber mirando previamente en nuestro código que tipo de botones queremos medir y cómo diferenciarlos de los demás, por ej. por su nombre de clase, o por la página/s o URL donde están.

INFORMES EVENTO GOOGLE ANALYTICS

¿Cómo veremos la información en Google Analytics y dónde?

Para ver la información de eventos debemos ir al menú de Analytics: Comportamiento / Eventos / Eventos Principales. Y navegar a la categoría de evento que corresponda haciendo click en ella. Por ejemplo: Interacción.

Fíjate que si utilizas como dimensión secundaria se ve todo más claro :)

Según el botón clicado, cambiará lo de COMPRA AHORA, SUSCRÍBETE AQUÍ, etc. si como en este ejemplo nos basamos en el CTA para diferenciar unos clicks de otros :)

Un ejemplo muy típico de iniciación a la automatización de eventos:

MEDICIÓN DE CLICKS EN ENLACES PDF (todos con una sola etiqueta y un activador)

Ejemplo de Activador: 

Tipo de activador - Click todos los elementos
Todos o Algunos - Algunos
Condición - Click Path termina en .pdf

Ejemplo de Etiqueta:

Categoría - Interacción 
Acción - Descarga PDF 
Etiqueta - Descarga PDF: {{Click Text}} - {{Click URL}}

PARA SEGUIR APRENDIENDO TAG MANAGER… POST MUY RELACIONADOS CON ESTE:

• Pruebas con la vista previa y ver si funciona el evento: Cómo probar eventos con Tag Manager
• Entender y aprovechar la lógica de los nombres de clase CSS en algunos frameworks: Aprovecha los estándares CSS de los frameworks con Google Tag Manager
• Ampliar sobre cómo medir cuando tenemos un enlace antiguo de tipo JavaScript o no podemos diferenciar el click con las variables típicas: Medir clicks en enlaces de tipo onClick o con atributos HTML5
• Conocer algunos tipos de variable personalizada, que es el complemento para las variables predefinidas: 4 variables clave en Google Tag Manager

VARIABLES DE GOOGLE TAG MANAGER

– TABLA DE CONSULTA

Trucos para Tablas de Consulta de Google Tag Manager

– TABLA DE EXPRESIONES REGULARES

Tabla de Expresiones Regulares o regEx Table en Google Tag Manager

– VARIABLES JAVASCRIPT personalizada

GTM & JavaScript personalizado: Kit de autosubsistencia (I)

GTM & JavaScript personalizado: Kit de autosubsistencia (II)