4 Variables Clave en Google Tag Manager

A la hora de trabajar con Google Tag Manager, a un nivel de usuario básico, te puedes arreglar perfectamente sin usar ningún tipo de Variable (Macro en GTM v1). Pero si deseas comenzar a realizar un uso más profesional, sin perder la simplicidad de uso, te aconsejo que empieces a usar desde ya estas Variables:

1. Variable Constante en Tag Manager

Fundamental usarla, como mínimo mínimo mínimo…, para los IDs de cliente de las etiquetas principales (ej. para poner el UA- de Google Analytics, el ID de cliente de AdWords, DoubleClick, etc.); aunque pueden tener muchos más usos. ¿Por qué es interesante utilizar las variables Constantes?

• Es más sencillo acordarte de un nombre de variable por ej. {{ID analytics}}, que ir al Administrador de Google Analytics, copiar y pegar.
• Te ahorrarán mucho trabajo en un futuro si deseas hacer una modificación global. Suponte que cambias de propiedad en Google Analytics, por ejemplo si estás realizando una migración de Classic a Universal.
• Puedes exportar un contenedor, y al importarlo, solo tendrás que cambiar la UA- una vez.

Ejemplo de Variable Constante de Google Tag Manager:

2. Variable de Tabla de consulta en Tag Mananger

¿Tienes etiquetas idénticas pero que solo se diferencian por un campo condicional? es decir, según algún otro factor o variable, como la regla de activación, si estás en vista de depuración o no, etc. etc., su valor es uno u otro. Por ej. diferentes conversiones tipo página de Google AdWords, en las que solo cambia el campo Etiqueta según la página de activación:

Más ejemplos de variables de Tabla de Consulta (Lookup Table) en este post anterior  sobre Tag Manager y Píxeles de Conversión.

Esta variable es un poco más compleja de entender, pero su utilidad es enorme. Literalmente: ¡¡ahorrarás etiquetas y esfuerzos!!

Otro ejemplo típico: tienes un entorno de pruebas y otro de producción, y te gustaría mandar los datos de ambos sitios a propiedades diferentes de Google Analytics:

Y si además, quieres que tus pruebas en la versión de depuración se vean también en la propiedad de pruebas, puedes rizar el rizo y anidar una tabla de consulta dentro de otra, para conseguir la secuencia condicional deseada:

Resumen condiciones y resultados:

• Estoy en dominio de pruebas → UA-88888888-1
• Estoy en dominio de producción, dos opciones:
  • Estoy en vista previa y depuración de GTM: UA-88888888-1
  • Estoy en vista normal de la web : UA-111111111-1

3. Variable de capa de datos (dataLayer) en Tag Mananger

Ésta, en muchos casos, es la variable más importante, ¡y con diferencia! porque es la que nos permite enviar de forma sencilla datos de nuestro sitio web a Google Tag Manager. Para allí poder utilizarlos en todas las etiquetas, variables y activadores que deseemos 

Por ejemplo, queremos recoger el importe del pedido en un sitio web de comercio electrónico, por ej. hecho en WordPress, y enviarlo a Google Adwords mediante su etiqueta de conversión:

EJEMPLO 1)) El código de dataLayer para enviar el importe del pedido a Google Tag Manager, resumido, sería ser algo así:

<script type="text/javascript">
window.dataLayer = window.dataLayer || [];
dataLayer.push({
'event': 'Pedido',
'revenue': '45'
});
</script>

Nota: Revenue = 45 es un mero ejemplo. Hay que mandar valor dinámico, por programación.

La variable para capturar el importe sería así de sencilla para el caso de arriba:

En “Nombre de variable de capa de datos”, ponemos el nombre de la Variable en dataLayer tal cual está en el código, en este caso pone: ‘revenue’: ‘45’, pues rellenamos revenue.

EJEMPLO 2)) Puede que ya estemos generando una dataLayer completa para Ecommerce Mejorado. Pues bien, mediante una variable de Capa de Datos un poco más compleja, podemos capturar el importe de pedido o revenue.

<script type="text/javascript">
window.dataLayer = window.dataLayer || [];
dataLayer.push({
 'event': 'Pedido',

 'ecommerce': {
 'purchase': {
 'actionField': {
 'id': '1234',
 'revenue': '45', 

 'tax':'',
 'shipping': '',
 'coupon': ''
 },
 'products': [{
 'name': '',
 'id': '',
 'price': '',
 'brand': '',
 'category': '',
 'variant': '',
 'quantity': 1,
 'coupon': ''
 }]
 }
 }
 });
</script>

Notas:
Es mejor mandar siempre evento en un push de venta, pues facilitará la creación del activador en GTM. Y lo más importante: si activamos el envío de la transacción justo en el evento de compra (no en carga de página), evitemos las transacciones repetidas si se recarga con F5 o se accede a la URL de confirmación por otra vía.

12324 es un ejemplo. El Id de pedido es obligatorio, rellenar con valor dinámico.
45 es otro ejemplo. El importe también es obligatorio y se envía como valor dinámico.

El resto de variables las dejamos vacías pues no proceden para este ejemplo. Y si no tuviéramos sus valores, esta sería la forma de hacerlo (mandarlas vacías, no suprimirlas y punto).

Pues bien, para recuperar el revenue aquí, es un poco más complejo, pero jugaremos con una propiedad fundamental de la dataLayer Versión 2:

Los valores de las variables anidadas podemos extraerlos, separándolas con un punto. Así que para sacar revenue llamamos a esta combinación de variables anidadas:

ecommerce.purchase.actionField.revenue

Interesante, ¿eh? 
Como veis, poco a poco, vamos a ir reutilizando recursos y minimizando esfuerzos al máximo con Google Tag Manager y las variables.

4. Variable JavaScript Personalizada en Tag Mananger

Mediante esta variable personalizada, inyectamos un código JavaScript en el sitio web, que sirve para recopilar cualquier dato que nos interese, utilizando una función JS:

La estructura de código de esta variable es:

<script>

function() {
var now = new Date();
return now.getTime();
}

</script>

 

Y aquí un ejemplo sencillo para el importe del pedido si suponemos que está dentro de un elemento con id=”importe”:

<script>

function() {
return document.getElementById('importe').innerHTML;
}

</script>

 

Este dato se recalcula cada vez que accedemos a la variable (como todas las variables de GTM), y en tiempo real. Si el elemento con id=”importe” está en la página (URL), la variable tendrá un valor; si no está en la página (no existe) devolverá undefined, null, o algo similar.

¿Cómo podemos estar seguros de si funcionan las variables?

Con la versión de Vista Previa y Depuración de Google Tag Manager, en la pestaña “Variables”, dentro de cualquier evento del menú izquierdo (en este caso “Page Load”), comprobamos el valor que tiene cada una de nuestras variables de GTM en ese momento concreto: