Guía rápida sobre variables de JavaScript en Google Tag Manager

Actualizado: 6 de mayo de 2025

Si alguna vez has intentado profundizar en la variable JavaScript dentro de Google Tag Manager, probablemente te has encontrado con un párrafo en la documentación oficial de Google y un poco más en la guía de Simo Ahava. Sin embargo, en general, la información es escasa. Por ello, he decidido investigar más a fondo y ofrecerte una visión más amplia sobre lo que realmente implica el concepto de Variable JavaScript.

Introducción a las variables en Google Tag Manager

El uso de variables en Google Tag Manager (GTM) es vital para la personalización y seguimiento de eventos en un sitio web. Con ellas, puedes recoger y utilizar datos específicos sin necesidad de modificar el código fuente de tu página. Sin embargo, es importante entender que hay diferentes tipos de variables, y en este caso, exploraremos específicamente las variables JavaScript.

Antes de profundizar en las variables, si deseas avanzar en tus habilidades de GTM, considera explorar recursos adicionales que te ofrecerán una comprensión más completa sobre JavaScript y su implementación en GTM.

Diferencias entre variables JavaScript y variables JavaScript personalizadas

Es común que algunas personas confundan las variables JavaScript con las variables JavaScript personalizadas en Google Tag Manager. Sin embargo, estos son conceptos distintos.

Las variables JavaScript estándar recuperan valores de variables globales ya existentes, como el título de la página o la URL. En cambio, las variables JavaScript personalizadas son funciones que pueden ser más complejas, como obtener el texto de un clic y transformarlo a minúsculas, o extraer el valor de un campo de un formulario.

Descripción breve de la variable JavaScript

Una descripción común que se encuentra en línea es:

La variable JavaScript devuelve el valor almacenado en la variable JavaScript global que especifiques.

Si eres nuevo en JavaScript, esta definición puede dejarte con más preguntas que respuestas. Por lo tanto, es crucial desglosar y entender cada componente.

¿Qué es una variable JavaScript global?

Para entender mejor, es fundamental conocer el concepto de alcance (scope) en JavaScript. Existen dos tipos de alcance:

• Alcance local: Variables que se declaran dentro de una función y solo son accesibles dentro de ella.
• Alcance global: Variables que se declaran fuera de cualquier función y son accesibles en cualquier parte del código.

Por ejemplo, considera el siguiente código:

function miFuncion() {
 var autorNombre = "Julius"; // variable local
}

En este caso, autorNombre solo puede ser accedida dentro de miFuncion. Si movemos la variable fuera de la función, se convierte en global:

var autorNombre = "Julius"; // variable global
function miFuncion() {
 // Aquí se puede usar autorNombre
}

Esto es relevante para Google Tag Manager porque permite que las variables JavaScript en GTM puedan recuperar valores de cualquier variable global disponible en ese momento.

Ejemplos útiles de variables JavaScript

Si ya tienes algo de experiencia con Google Tag Manager, probablemente hayas utilizado la variable Título de la Página antes. Para ello, basta con ingresar document.title en la configuración de la variable JavaScript, y ¡listo!

A continuación, te presento otros ejemplos útiles de variables JavaScript que pueden ser implementados:

• navigator.language: Recupera el idioma del navegador del usuario.
• navigator.userAgent: Proporciona información sobre el agente de usuario, esencial para entender qué tipo de dispositivo o navegador está utilizando el visitante.
• document.referrer: Muestra la dirección de la página anterior visitada, útil para analizar el tráfico de referencia.
• document.URL: Devuelve la URL completa de la página actual, incluyendo fragmentos, parámetros y puertos.

Si deseas explorar más sobre variables globales estándar, puedes encontrar una lista completa en W3Schools.

Recursos para principiantes en JavaScript

Si te consideras un principiante en JavaScript, aquí tienes algunos recursos que te ayudarán a comprender mejor el concepto de alcance en este lenguaje:

• Tutorial en video de 5 minutos sobre variables locales y globales. Nivel: principiante.
• Alcance en JavaScript, W3Schools. Nivel: principiante.
• Lista de variables globales estándar.

Descubriendo más variables globales

Además, si deseas ver qué variables globales hay disponibles en tu sitio web, abre la consola de desarrollo de tu navegador. En Chrome, puedes seguir este tutorial, donde deberás escribir window y presionar Enter.

Al hacer clic en el triángulo negro junto a Window, podrás ver una lista de variables JavaScript globales.

Por ejemplo, si estás interesado en el valor de vid que se encuentra en el objeto gaGlobal, simplemente ingresa gaGlobal.vid como el nombre de la variable global en la configuración de la variable JavaScript.

Esto ofrece una gran flexibilidad para trabajar con datos en GTM. Si conoces otros ejemplos útiles de variables JavaScript que no se han mencionado aquí, me encantaría conocer tus ideas. ¡El espacio de comentarios está a tu disposición!