Tipos de variables definidas por el usuario para páginas web

Puede crear variables personalizadas para páginas web en Google Tag Manager si las variables integradas no satisfacen sus necesidades específicas.

Para crear una variable definida por el usuario:

1. En el panel de navegación de la izquierda, haz clic en Variables.
2. En la sección Variables definidas por el usuario, haz clic en Nueva.
3. Haz clic en Configuración de la variable y selecciona el tipo de variable que quiera.
4. Introduzca las opciones de configuración del tipo de variable seleccionado.
5. Póngale un nombre a la variable. Use un nombre esquemático y que describa su función, por ejemplo, "variable de capa de datos - nombre del producto".
6. Haz clic en Guardar.

Tag Manager admite estos tipos de variables definidas por el usuario para sitios web:

• Navegación
  • URL referente HTTP
  • URL
• Variables de página
  • Cookie propia
  • JavaScript personalizado
  • Capa de datos
• Elementos de página
  • Variable de evento automático
  • Elemento DOM
  • Visibilidad del elemento
• Utilidades
  • Almacenamiento de Analytics
  • Constante
  • Evento personalizado
  • Nombre del entorno
  • Configuración de Google Analytics
  • Etiqueta de Google: ajustes de configuración
  • Etiqueta de Google: configuración de eventos
  • Tabla de consulta
  • Número aleatorio
  • Tabla RegEx
• Datos proporcionados por los usuarios
• Datos del contenedor
  • ID de contenedor
  • Número de versión del contenedor
  • Modo de depuración

Navegación

URL referente HTTP

El valor que se asigna es el HTTP referente, que es la URL de la página anterior que ha visitado el usuario. Por ejemplo, si un usuario navega a una de sus páginas de producto desde la página principal, la URL de referencia será la página principal. Tag Manager crea automáticamente una instancia de este tipo de variable, pero se pueden crear más si se quieren exponer diferentes partes de la URL referente.

URL

Con este tipo de variable se pueden analizar y exponer componentes de la URL. Puede crear más instancias para exponer distintas partes de la URL. Los componentes de la URL entre los que puede elegir son URL completa, protocolo, nombre de host, puerto, ruta, extensión de nombre de archivo, consulta y fragmento. El valor de entrada de este tipo de variables es la URL de la página en la que se encuentra el usuario, que se extrae de document.location. En Origen de la URL, puede indicar la variable que quiera que Tag Manager use como fuente del valor de la URL.

Variables de la página

Cookie propia

A esta variable se le asigna el valor de una cookie propia con el nombre del dominio en el que se encuentra el usuario en ese momento. Si se implementa más de una cookie con el mismo nombre en el mismo dominio, se elige el primer valor. Sucede lo mismo que si llama a document.cookie desde una página y elige el primer resultado.

JavaScript personalizado

El valor que se asigna es el resultado de una función JavaScript. El código JavaScript debe adoptar el formato de una función anónima que devuelva un valor. Por ejemplo, se puede crear una variable JavaScript personalizada para convertir todas las instancias de la variable {{url}} predefinida a minúsculas:

function () {
  return {{url}}.toLowerCase();
}

Capa de datos

Se le asigna un valor cuando los datos se envían a la capa de datos a través de la llamada dataLayer.push():
dataLayer.push({"Data Layer Name": "value"}).

En Tag Manager, puede especificar cómo interpretar los puntos (".") en los nombres de las claves:

• Versión 1: se permiten puntos en los nombres de clave. Por ejemplo, en dataLayer.push("a.b.c": "value"), el nombre de la clave se interpretaría como a.b.c (es decir, {"a.b.c": "value"}).
• Versión 2: los puntos se interpretan como valores anidados. Por ejemplo, se interpretaría dataLayer.push({"a.b.c": "value"}) como tres valores anidados: {a: {b: {c: "value"}}}.

Variable de JavaScript

El valor que se asigna es la variable JavaScript global que especifique. Si el valor requerido no está en la capa de datos (consulta Capa de datos) ni lo encuentras en el DOM (consulta Elemento DOM), probablemente puedas recuperarlo con una variable JavaScript. Úsela si el valor que busca está en el código fuente de la página como una variable JavaScript.

Elementos de página

Variable de evento automático

Captura información sobre elementos que hayan activado eventos (p. ej., clics, envíos de formularios o visibilidad de elementos).

• Elemento: devuelve el objeto del elemento. Se puede usar como un objeto de JavaScript personalizado (por ejemplo, {{Element}}.title) o en selectores de CSS (por ejemplo, {{Element}} coincide con el selector de CSS div.foo).
• Tipo de elemento: devuelve el valor de element.tagName (por ejemplo, "A", "BUTTON", "IMG").
• Atributo del elemento: al especificar un nombre de atributo, esta opción devuelve su valor.
• Clases de elemento: devuelve la lista de clases encontradas en el atributo class del elemento.
• ID de elemento: devuelve el valor del atributo id.
• Segmentación de elemento: devuelve el valor del atributo target (por ejemplo, "_blank").
• Elemento textual: devuelve el valor del contenido de texto del elemento.
• URL de elemento: devuelve la URL del elemento, que recupera de los atributos href o action.
• Nuevo fragmento de URL del historial: devuelve el nuevo fragmento de la URL del historial del navegador (por ejemplo, "#summary").
• Fragmento antiguo de URL del historial: devuelve el fragmento antiguo de la URL del historial del navegador (por ejemplo, "#intro").
• Estado nuevo del historial: objeto de estado de historial nuevo, controlado por las llamadas del sitio web a pushState.
• Estado antiguo del historial: objeto de estado del historial anterior, controlado por las llamadas del sitio web a pushState.
• Fuente del cambio de historial: devuelve el evento que ha causado un cambio en el historial (por ejemplo, "pushState" o "replaceState").

Elemento DOM

El valor que se asigna es el texto del elemento DOM (modelo de objetos del documento) o el valor del atributo de elemento DOM especificado. Si el valor deseado no está configurado en la capa de datos (consulte Capa de datos), es posible que el valor se pueda recuperar del DOM. Use este tipo de variable si el valor que busca está en el DOM.

Si define el nombre de atributo opcional, la variable devolverá el valor especificado en dicho atributo (por ejemplo, data-food="cupcake"); de lo contrario, el valor de la variable será el texto del elemento DOM.

Visibilidad del elemento

El valor se asigna según el estado de visibilidad del elemento DOM especificado. A diferencia del activador Visibilidad del elemento, esta variable solo puede informar de la visibilidad de un único elemento. Elija si seleccionar un elemento en función de su ID o de un selector de CSS. Si varios elementos coinciden con el patrón del selector de CSS especificado, se utilizará el primer elemento coincidente.

Puede elegir el tipo de salida de esta variable:

• Verdadero/Falso: un valor booleano que indica si el elemento seleccionado se mostrará cuando se haga referencia a la variable.
• Porcentaje: un valor numérico entre 0 y 100 que indica el porcentaje del elemento seleccionado que se muestra en la pantalla cuando se hace referencia a la variable.

Si selecciona Verdadero/Falso como tipo de salida, también puede especificar el Porcentaje mínimo visible del elemento seleccionado que debe mostrarse en la pantalla para que se devuelva el valor Verdadero.

Utilidades

Almacenamiento de Analytics

El tipo de variable de almacenamiento de Analytics es una opción de variable personalizada y una forma fiable de acceder a los identificadores esenciales de Google Analytics.

Cuando crea una variable de almacenamiento de Analytics personalizada, puede seleccionar los siguientes campos de datos:

• ID de cliente: identificador único de un usuario o dispositivo seudonimizado.
• ID de sesión: identificador único de una sesión de usuario.
• Número de sesión: el número de la sesión actual del usuario.

La variable también incluye una sección "Más ajustes", que ofrece una configuración opcional basada en el campo de datos seleccionado:

Campo de datos	ID de medición	Prefijo de las cookies	Descripción
ID de cliente	No aplicable	Opcional	Permite filtrar por un prefijo de cookie específico si es necesario.
ID de la sesión	Opcional	Opcional	Si se proporciona un ID de medición, Google Tag Manager devolverá el ID de sesión único correspondiente a ese ID de medición. Si no se proporciona ningún ID de medición, devuelve una cadena compuesta que contiene los IDs de todas las cookies de sesión de Google Analytics pertinentes.
Número de la sesión	Opcional	Opcional	Si se proporciona un ID de medición, Google Tag Manager devolverá el número de sesión correspondiente a ese ID de medición. Si no se proporciona ningún ID de medición, devuelve una cadena compuesta que contiene números de todas las cookies de sesión de Google Analytics pertinentes.

Al abstraer la complejidad de leer y analizar varias cookies de Google Analytics, la variable de almacenamiento de Analytics asegura que los identificadores obtenidos sean sólidos y compatibles para usarse en contextos como Measurement Protocol.

Constante

El valor que se asigna es la cadena que proporcione. Las variables de cadena constante se suelen usar cuando hay varias etiquetas que tienen el mismo número de cuenta. Consulte también Configuración de Google Analytics.

Evento personalizado

El valor que se asigna es el nombre del evento personalizado que se ha enviado a la capa de datos.

Nombre del entorno

Devuelve el nombre del entorno que se visualiza en el modo de vista previa.

Etiqueta de Google: ajustes de configuración

Esta variable te permite definir parámetros a nivel de configuración cuando se carga la etiqueta de Google.

Por ejemplo, supongamos que publicas tu sitio web en varios idiomas y quieres segmentar la audiencia por su idioma. Puede crear una variable de configuración con el parámetro language y usarla en sus etiquetas de Google, en lugar de actualizar manualmente cada etiqueta.

Consulta cómo reutilizar los ajustes de configuración.

Etiqueta de Google: configuración de eventos

Esta variable te permite definir parámetros a nivel de evento para enviar datos adicionales con un evento de GA4.

Por ejemplo, imagine que tiene una tienda online que está de rebajas. Ahora, quieres hacer un seguimiento del número de personas que utilizan tu código de descuento. En lugar de añadir el parámetro discount a cada una de las etiquetas manualmente, puede reutilizar el parámetro con una variable del tipo Etiqueta de Google: configuración de eventos.

Consulta cómo reutilizar los ajustes de configuración.

Tabla de consulta

El valor se asigna según las instrucciones de la tabla de búsqueda. Esta tabla contiene dos columnas (la tabla está vacía para ilustrar cómo se usan los datos más adelante):

Cuando [seleccionar variable] es igual a	A [esta variable] se le asigna

La tabla de búsqueda permite crear variables cuyos valores cambian en función de los de otras variables. Esto es útil si su sitio web está configurado de tal manera que se pueda asignar el valor adecuado a la URL, al elemento DOM o a cualquier otra parte de la página (por ejemplo, un ID de conversión). En este ejemplo, se crea una variable denominada "ID de conversión". Si la URL es "/gracias/compra1.html", el valor que se asigna es "12345"; si la URL contiene "gracias/compra2.html", se le asigna "34567".

Cuando {{url}} contiene	A {{ID de conversión}} se le asigna
/gracias/compra1.html	12345
/gracias/compra2.html	34567
/gracias/compra3.html	56789

Número aleatorio

El valor que se asigna es un número aleatorio comprendido entre 0 y 2147483647.

Tabla RegEx

Es similar a la variable de tabla de consulta, con el añadido de que permite ejecutar patrones de expresiones regulares que coincidan con los elementos que quiera.

Si la configuración de la tabla RegEx es esta:

Patrón	Salida
.*/page[1-3]\.html.*	foo
.*/page[4-6]\.html.*	bar
.*/page[7-9]\.html.*	baz

El valor de salida de la variable será:

Resultado coincidente	Valor
http://example.com/page1.html	foo
http://www.example.com/page1.html	foo
http://example.com/page2.html#detail	foo
http://example.com/page5.html	bar
http://example.com/page5.html?status=new	bar
http://example.com/page6.html	bar
https://example.com/page9.html	baz

Las consultas de la tabla RegEx se ejecutan en toda la lista, de arriba hacia abajo. Cuando en una consulta se encuentra una coincidencia, se devuelve el valor de salida correspondiente.

Selecciona Definir valor predeterminado para especificar qué valor de salida se debe devolver si no se encuentran coincidencias.

De forma predeterminada, los patrones deben coincidir con toda la cadena de entrada y no distinguen entre mayúsculas y minúsculas. Este comportamiento se puede cambiar en Configuración avanzada:

• No distinguir entre mayúsculas y minúsculas: los patrones no diferenciarán mayúsculas de minúsculas a la hora de buscar coincidencias, sin tener que definirlo explícitamente en la expresión regular.

• Solo coincidencias totales: si se habilita esta opción, los patrones buscarán coincidencias con toda la entrada. Esto equivale a tener anclajes de inicio (^) y fin ($) de forma implícita alrededor del patrón. Si la inhabilita, los patrones buscarán coincidencias con cualquier parte de la entrada.

• Habilitar función de grupos de captura y reemplazos: si habilita esta opción, podrá utilizar la sintaxis de sustitución con el símbolo del dólar para incluir partes de la entrada en la salida (por ejemplo, grupos de captura en el patrón coincidente). Por ejemplo, en la expresión regular /(noticias)/página(2)\.html podría utilizar $1 para hacer referencia al primer grupo de captura ("noticias") y $2 para hacer referencia al segundo ("2").

Usar "Habilitar función de grupos de captura y reemplazos" con la opción "Solo coincidencias totales" inhabilitada puede provocar un comportamiento inesperado, como devolver todo el valor de entrada con la parte coincidente reemplazada.

Datos proporcionados por los usuarios

Se recoge información del formulario de contacto, como el correo electrónico, el teléfono, el nombre y la dirección. Especifica la información que quieras recoger con uno de los siguientes métodos:

• Configuración automática: detecta automáticamente los campos de formulario de tu sitio web y las entradas nuevas.
• Configuración manual: te permite asignar variables de Tag Manager a los correspondientes campos de datos proporcionados por los usuarios, como el correo electrónico, el número de teléfono, el nombre y la dirección.
• Código: te permite especificar una variable de capa de datos o una variable de JavaScript personalizada que devuelva el objeto de datos estructurados proporcionados por el usuario.

Datos del contenedor

ID de contenedor

Devuelve el ID del contenedor de Tag Manager, (por ejemplo, "GTM-101010").

Número de versión del contenedor

Cuando el contenedor está en modo de vista previa, la variable de versión del contenedor devuelve el número de versión preliminar del contenedor. Si no, devuelve el número de la versión publicada.

Modo de depuración

El valor que se asigna es "true" si el contenedor está en modo de vista previa y depuración, y "false" si no.