Explicación del disparador de eventos personalizados en Google Tag Manager

¿Quieres ver el contenido de la página? Mostrar

Actualizado: 2 de abril de 2025

El trigger de evento personalizado en Google Tag Manager (GTM) puede parecer un concepto aburrido, pero su importancia es indiscutible debido a su amplia aplicación en el análisis de datos. Sin este recurso, tareas como el seguimiento de clics o envíos de formularios AJAX serían prácticamente imposibles. De hecho, más del 80% de las recetas de GTM requieren eventos personalizados para funcionar correctamente. Entonces, ¿qué es exactamente y por qué deberías prestarle atención? En este artículo, desglosaremos todo lo que necesitas saber sobre los eventos personalizados en Google Tag Manager.

Introducción a los eventos personalizados en Google Tag Manager

Un evento personalizado en Google Tag Manager se utiliza para rastrear interacciones en tu sitio web o aplicación móvil que no se capturan mediante métodos estándar. Estos métodos pueden incluir:

Sin embargo, la mayoría de los eventos que se generan en el Data Layer son denominados eventos personalizados. A continuación, se presentan algunos ejemplos:

Si tienes un formulario en tu sitio web que no puede ser rastreado mediante un trigger de envío estándar, puedes solicitar a un desarrollador que active un evento de Data Layer cuando ese formulario sea enviado con éxito. Este evento se convierte en un evento de envío de formulario personalizado.
Cuando un usuario inicia sesión en su cuenta, pero la URL de la página no cambia, el seguimiento de vistas de página no funcionará. Aquí, puedes pedirle a un desarrollador que empuje el evento «login» al Data Layer. Luego, podrás capturar este evento en el Data Layer utilizando el trigger de evento personalizado.

Recuerda, cualquier evento del Data Layer que no se soporte mediante un trigger predeterminado de GTM se considera un evento personalizado.

Origen de los eventos personalizados

Por lo general, los eventos personalizados son generados por oyentes de eventos automáticos personalizados, es decir, funciones de JavaScript que están diseñadas para escuchar interacciones específicas en una página web. Cuando estas interacciones ocurren, los oyentes activan un evento dataLayer.push.

Así es como los eventos personalizados llegan a la superficie. He recopilado una variedad de oyentes automáticos personalizados listos para usar disponibles para ti. Si deseas rastrear algo más específico y no tienes experiencia en programación, puedes solicitar a un desarrollador que escriba un oyente automático personalizado. Este es el método más sencillo para comenzar a enviar eventos personalizados.

Basado en mi experiencia, en el pasado pasé más de un día tratando de averiguar cómo rastrear una interacción particular en una página web. Sin embargo, para un colega con experiencia en JavaScript, le tomó solo 15 minutos escribir un oyente personalizado para la misma interacción. ¡La diferencia es notable!

Colaboración efectiva con un desarrollador

Es probable que muchos de los lectores empezaran a utilizar Google Tag Manager tras escuchar que los desarrolladores ya no serían necesarios para el seguimiento web. La promesa era que los analistas web podrían rastrear todas las interacciones y desplegar etiquetas de marketing por su cuenta. ¿Te suena familiar?

Sin embargo, aunque esta afirmación no es completamente falsa, tampoco es del todo cierta. No hay una respuesta sencilla a esto.

Puedes rastrear muchas interacciones web sin la ayuda de un desarrollador, lo cual es genial. Pero el mundo web está lleno de soluciones únicas y no estándar. Si no tienes conocimientos de programación, debes estar preparado para trabajar en colaboración con un desarrollador.

Colaboración

Imagina que deseas rastrear una interacción específica. Has probado varios métodos y no has tenido éxito. ¿Cuál es tu próximo paso? ¡Pedir ayuda a un desarrollador!

No hay vergüenza en ello; trabajar junto a un desarrollador es una de las mejores prácticas de Google Tag Manager.

Entonces, ¿qué sigue?

Paso 1: Preparar un código de evento del Data Layer

Primero, debes preparar un fragmento de código para el evento del Data Layer y entregárselo al desarrollador. Aquí tienes un ejemplo:

<script>
 window.dataLayer = window.dataLayer || [];
 window.dataLayer.push({
  'event': 'registrationComplete'
 });
</script>

Notarás que este código es un poco diferente del que Google recomienda, que es:

<script>
 dataLayer.push({
  'event': 'registrationComplete'
 });
</script>

Para evitar problemas con el alcance de la variable dataLayer, deberías utilizar el prefijo window.

Ahora, volvamos al ejemplo del código dataLayer.push. No necesitas ser un desarrollador para entender cómo preparar un fragmento de código para un evento del Data Layer. Simplemente copia mi ejemplo y edítalo. Por ejemplo:

<script>
 window.dataLayer = window.dataLayer || [];
 window.dataLayer.push({
  'event': 'registrationComplete',
  'registrationCountry': 'United States',
  'plan': 'Premium'
 });
</script>

He añadido dos líneas adicionales con registrationCountry y plan. Recuerda que la última línea no debe terminar con una coma. En este caso, sería:

'plan': 'Premium'

Puedes incluso añadir diez líneas más si lo deseas.

Además, informa al desarrollador que los valores de esos dos atributos necesitan ser reemplazados dinámicamente. Si un visitante selecciona Noruega como país de registro, este valor debe reflejarse también en el fragmento del evento del Data Layer.

'registrationCountry': 'Norway',

Paso 2: Indicar al desarrollador cuándo activar este código

Otro paso importante es explicar al desarrollador CUÁNDO deseas que se active el evento dataLayer.push. Si estás interesado en rastrear un formulario específico, el evento del Data Layer debe activarse después de que el envío sea exitoso.

Paso 3: Probar el evento

Después de que el desarrollador complete su tarea, activa el modo de vista previa y depuración de GTM para probarlo. Realiza la interacción específica (por ejemplo, enviar el formulario) y verifica si el evento del Data Layer aparece en el modo de vista previa y depuración. Debería verse así:

¡Todo bien hasta ahora! Ahora, verifiquemos si el desarrollador pasó los dos atributos adicionales que pediste, registrationCountry y plan.

En el modo de vista previa y depuración, haz clic en el evento registrationComplete y dirígete a la pestaña del Data Layer. Si ves ambos atributos en el Data Layer, significa que el desarrollador ha hecho un buen trabajo.

Paso 4: Configurar GTM

Por defecto, los eventos del Data Layer no aparecen como triggers en Google Tag Manager. Debes hacerlo manualmente. Dado que estamos interesados en rastrear envíos exitosos de formularios, necesitamos informar a GTM que los eventos registrationComplete son importantes y que queremos utilizarlos como triggers.

En Google Tag Manager, ve a Triggers y haz clic en el botón Nuevo. Selecciona Evento personalizado como tipo de trigger e ingresa la siguiente configuración:

¡Listo! Has creado un trigger de evento personalizado en Google Tag Manager. Si quieres utilizar registrationCountry y plan como variables en tus etiquetas de GTM, consulta la guía sobre cómo acceder a datos en el Data Layer y convertirlas en variables de GTM.

Ejemplo: Envío de un evento a GA4 cuando un usuario se registre

Continuemos con el ejemplo de seguimiento de registros. Hasta ahora hemos logrado:

Pedir a un desarrollador que implemente el código dataLayer.push cuando un usuario se registre con éxito. El valor de la clave del evento es registrationComplete.
Un desarrollador ha implementado nuestra solicitud, y lo verificamos en el modo de vista previa y depuración (pestaña del Data Layer).
Creamos un trigger de evento personalizado registrationComplete.

¿Y ahora qué? Enviemos un evento a Google Analytics 4 cada vez que se empuje un evento registrationComplete al Data Layer. Enviaremos los datos a GA4 como un evento sign_up, que es un evento recomendado por Google. Además, pasaremos el valor del plan (el plan de precios al que se registró el usuario).

Variable del Data Layer

En Google Tag Manager, ve a Variables > Variables definidas por el usuario > Nuevo > Variable del Data Layer. Introduce la siguiente configuración:

Especificamos «plan» porque ese es el nombre de la clave en el Data Layer (cuando se empuja el evento registrationComplete al DL). Puedes aprender más sobre la Variable del Data Layer aquí.

Creando tu etiqueta de evento de Google Analytics 4

Ahora, vamos a crear una etiqueta de evento de GA4 que enviará los datos del evento a Google Analytics 4 cada vez que se empuje un registrationComplete al Data Layer. Dirígete a Etiquetas > Nuevo > Google Analytics > Google Analytics: Evento GA4 en Google Tag Manager. Introduce la siguiente configuración:

Ingresa el nombre del evento como sign_up (porque es un evento recomendado por Google).
Vamos a enviar la variable recién creada de vuelta a GA4 junto con el evento sign_up. Expande Parámetros del evento y haz clic en Agregar fila. Añade pricing_plan como nombre del parámetro y {{dlv – pricingPlan}} como el Valor. Esto te permitirá segmentar aún más los números de sign_up por plan de precios.
El trigger para esta etiqueta de evento será el trigger de evento personalizado registrationComplete que creamos anteriormente.

Pruebas finales

Guarda la etiqueta de GA4 y haz clic en el botón de Vista previa en GTM nuevamente. Tu sitio web se refrescará, lo que significa que deberías completar el registro una vez más. Al hacerlo, el evento del Data Layer registrationComplete aparecerá en el modo de vista previa. Haz clic en él y verifica si tu etiqueta de evento de GA4 se activó.

Si la etiqueta no se activó, revisa si has ingresado el nombre del evento correcto en la configuración del trigger. Es fundamental que ingreses el nombre del evento exactamente como aparece en el Data Layer (es sensible a mayúsculas).

Si la etiqueta se activó correctamente, dirígete a la vista de depuración de Google Analytics 4. Verifica si el evento y el parámetro personalizado se han enviado a GA4.

Una vez que todo funcione correctamente, publica tu contenedor de GTM para activar esta configuración de seguimiento para todos los visitantes de tu sitio web.

Si aún tienes problemas con la prueba de tus etiquetas en GTM, consulta este artículo que contiene varios consejos de depuración.

Registro del evento sign_up como un evento clave en Google Analytics 4

Nota: Google Analytics renombró las conversiones como Eventos clave.

El paso final consiste en convertir el evento sign_up de GA4 en un evento clave.

En tu propiedad de Google Analytics, ve a Administrar y selecciona Eventos clave en la columna de Propiedad. Haz clic en Agregar evento clave.

Introduce el nombre del evento como sign_up.

Con esta configuración, cada vez que se registre un evento sign_up en Google Analytics, también se contará como un evento clave. Verifica esto en la vista de depuración de GA4; debería reflejarse en unos minutos.

También podrás verificar estos eventos clave en los informes en tiempo real de GA4. Así que cada vez que guardes este evento clave y completes otro registro en tu sitio web, dirígete a Informes > Tiempo real y verifica el widget que los indica.

Explorando más sobre Google Tag Manager y su funcionalidad

Google Tag Manager no solo se limita al seguimiento de eventos personalizados. Tiene una amplia gama de aplicaciones que pueden mejorar significativamente el análisis de datos de tu sitio web. Algunas áreas que puedes explorar son:

Seguimiento de scroll: Permite medir cuán lejos los usuarios se desplazan por una página, lo que puede ser útil para entender el interés en el contenido.
Seguimiento de clics: Captura interacciones específicas en botones, enlaces y otros elementos de la página.
Integración con plataformas de publicidad: Facilita la implementación de etiquetas de seguimiento para campañas publicitarias, optimizando así el retorno de inversión.
Personalización de experiencias de usuario: Permite activar acciones específicas basadas en el comportamiento del usuario en tiempo real.

Al comprender y aplicar estos elementos, podrás maximizar el uso de Google Tag Manager y obtener insights valiosos que guíen tus decisiones de marketing y diseño web.

Conclusiones sobre el uso de eventos personalizados en GTM

El uso de eventos personalizados en Google Tag Manager es esencial para rastrear interacciones que no se gestionan con métodos estándares. Cada evento en el Data Layer que no es compatible con un trigger predeterminado puede clasificarse como un evento personalizado.

Sin la implementación de eventos personalizados, sería imposible realizar seguimientos efectivos de interacciones como el seguimiento de scroll o formularios AJAX.

Al identificar interacciones no estándar que no pueden ser rastreadas mediante soluciones de seguimiento prefabricadas (como las recetas de GTM), colabora con un desarrollador para: