Cómo medir envíos de formularios con Google Tag Manager y GA4

Por el equipo de Mayab Media · Nivel: Intermedio · Tiempo: 45 minutos

Tu formulario de contacto manda correos todos los días, pero GA4 casi no registra nada. O pasa lo contrario: GA4 reporta el doble de prospectos de los que recibiste, porque cuenta cada clic en el botón de enviar, incluidos los que fallaron la validación. Los dos problemas tienen el mismo origen. Medir formularios parece sencillo, pero los formularios se construyen de muchas maneras y cada una necesita un detector distinto.

Google Tag Manager te da varias formas de captar un envío. El activador integrado de Envío de formulario (Form Submission) funciona con formularios HTML clásicos que recargan la página. Muchos formularios modernos (plugins de WordPress, formularios incrustados de HubSpot, bloques de Squarespace, formularios hechos en React) envían en segundo plano con AJAX, y ese activador nunca se dispara. Para ellos, vigilas una página de gracias, un mensaje de éxito o un evento de dataLayer que agregue tu desarrollador.

Esta guía te muestra cómo identificar el tipo de formulario, elegir el método que le corresponde, enviar un evento generate_lead limpio a GA4 y comprobar que solo se dispara cuando el envío fue exitoso.

Respuesta rápida

1. Envía el formulario en modo Vista previa de GTM y observa qué eventos aparecen (Form Submit, una vista de la página de gracias o nada).
2. Elige el método: activador de envío de formulario, vista de la página de gracias, visibilidad del mensaje de éxito o un dataLayer.push del desarrollador.
3. Crea una etiqueta Google Analytics: evento de GA4 llamada generate_lead con parámetros útiles como form_name.
4. Asigna el activador, prueba un envío exitoso y uno fallido, y revisa DebugView.
5. Publica el contenedor y marca generate_lead como evento clave en GA4.

Antes de empezar

• Acceso: permiso para publicar en Google Tag Manager (o alguien que publique por ti) y acceso de Editor en GA4.
• GTM instalado y funcionando. Si no estás seguro, sigue primero nuestra guía para instalar Google Tag Manager.
• Una etiqueta de Google para GA4 en el contenedor, que se dispare en todas las páginas con tu ID de medición G-XXXXXXXXXX.
• Datos de prueba. Usa un correo de prueba y avisa a quien recibe los prospectos para que nadie llame a un cliente falso.
• Tiempo: de 30 a 60 minutos, según el tipo de formulario.
• Respaldo: GTM guarda cada versión publicada y puedes regresar a una anterior en Versiones. Aun así, nombra tus cambios con claridad.

Revisa una cosa más antes de construir. En GA4 ve a Admin > Data collection and modification > Data streams (flujos de datos), abre tu flujo web y mira la Medición mejorada. Si Interacciones con formularios está activada, GA4 ya envía form_start y form_submit por su cuenta. Esos eventos automáticos no distinguen un envío exitoso de uno fallido y también pueden dispararse en otros formularios de la página, como buscadores o casillas de boletín. Si creas tu propio evento de prospecto, puedes dejar el automático, pero no lo marques como evento clave. O desactiva Interacciones con formularios para evitar confusiones.

Paso 1: Descubre cómo se envía tu formulario

Abre GTM y haz clic en Vista previa. Escribe la URL de tu página y conecta Tag Assistant. Ahora llena el formulario con datos de prueba y envíalo. Observa la lista de eventos a la izquierda en Tag Assistant.

Lo que aparece te dice qué tipo de formulario tienes:

Si no aparece nada, primero activa las variables integradas de formulario. Ve a Variables > Configurar en Variables integradas y marca Form Element, Form ID, Form Classes, Form Target, Form URL y Form Text. GTM solo escucha envíos de formulario cuando existe un activador de ese tipo, así que la ausencia del evento también puede significar que aún no creas uno. Crea un activador de prueba como en el Paso 2A y repite el envío.

Cuando haces clic en el evento Form Submit de la línea de tiempo y abres la pestaña Variables, busca valores como estos (los tuyos serán distintos):

Anota el Form ID o una clase estable. La usarás para apuntar solo a este formulario. Si Tags Fired (etiquetas activadas) está vacío en este punto, es normal: todavía no creas la etiqueta.

Paso 2A: Usa el activador de envío de formulario (formularios clásicos)

Usa este método solo si en el Paso 1 viste un evento Form Submit real.

1. En GTM, ve a Triggers (activadores) > New (nuevo).
2. Haz clic en Trigger Configuration. En Choose trigger type (elige el tipo de activador), baja al grupo User Engagement (interacción del usuario) y elige Form Submission (envío de formulario).
3. Marca Check Validation (comprobar validación). Así GTM ignora los envíos que la página bloquea, como un formulario con campos obligatorios vacíos.
4. Deja sin marcar Wait for Tags (esperar a las etiquetas), salvo que se pierdan los hits de GA4 al recargar. Si lo activas, conserva el tiempo de espera predeterminado.
5. En Enable this trigger when all of these conditions are true (habilitar el activador cuando se cumplan estas condiciones), agrega Page URL contiene /contacto (o Page URL coincide con la expresión regular, matches RegEx, .* para todas las páginas).
6. En This trigger fires on (este activador se activa en), elige Some Forms (algunos formularios) y agrega Form ID es igual a contact-form.
7. Llámalo Form Submit - Contacto y guarda.

1. Check Validation evita que los envíos que la página cancela disparen la etiqueta.
2. Cuando marcas Wait for Tags o Check Validation, GTM muestra un aviso amarillo que recomienda habilitar el activador solo en las páginas que lo necesitan. Para eso sirve la fila Enable this trigger when all of these conditions are true.
3. Some Forms con un filtro por Form ID apunta solo a tu formulario de contacto.

Un aviso: algunos formularios validan con JavaScript después del evento de envío. En ese caso el activador aún puede dispararse en un intento fallido. Por eso el Paso 4 incluye una prueba de envío fallido.

Paso 2B: Usa la página de gracias (formularios que redirigen)

Si tu formulario manda a la gente a una página de confirmación, esta es la opción más simple y confiable.

1. Ve a Activadores > Nuevo > Vista de página (o DOM listo).
2. Elige Algunas vistas de página.
3. Define Page Path es igual a /gracias (usa tu ruta real).
4. Guárdalo como Pageview - Gracias.

Asegúrate de que nadie pueda llegar a esa página de otra forma. Quítala del menú y del sitemap, ponle noindex y no la enlaces desde correos. Si no, cada visita contará como prospecto.

Paso 2C: Usa la visibilidad del elemento (formularios AJAX con mensaje de éxito)

La mayoría de los plugins de formularios de WordPress, los constructores de páginas y muchos formularios incrustados envían con AJAX. La página no se recarga. En su lugar aparece un mensaje como «Gracias, te contactaremos pronto». Puedes disparar la etiqueta con ese mensaje.

1. Envía el formulario una vez, haz clic derecho sobre el mensaje de éxito y elige Inspeccionar.
2. Busca un selector estable. Fíjate en una clase como .form-success o un ID. (Guías antiguas mencionan .wpcf7-mail-sent-ok de Contact Form 7; las versiones actuales ya no usan esa clase, así que inspecciona tu propia página). Evita clases generadas automáticamente que cambian en cada compilación.
3. En GTM, crea un activador de tipo Element Visibility (visibilidad del elemento).
4. En Selection Method (método de selección) elige ID (si el mensaje tiene ID) o CSS Selector, y escribe el ID o el selector.
5. En When to fire this trigger (cuándo activar) elige Once per page (una vez por página).
6. Marca Observe DOM changes (observar cambios en el DOM). Es indispensable, porque el mensaje no existía cuando cargó la página.
7. En Advanced, el Minimum Percent Visible (porcentaje mínimo visible) viene en 50. Bájalo a algo como 1 si el mensaje es pequeño o queda en parte fuera de pantalla.
8. Guárdalo como Visibilidad - Form éxito.

1. El ID (o selector CSS) del mensaje que solo aparece tras un envío exitoso.
2. Once per page evita disparos repetidos si el mensaje vuelve a mostrarse.
3. Observe DOM changes permite que GTM vea elementos agregados después de cargar la página.

Si el mensaje de éxito queda oculto fuera de la pantalla o aparece en una ventana que se cierra al instante, la visibilidad del elemento puede fallar. En ese caso pide el método de dataLayer que sigue.

Paso 2D: Usa un evento de dataLayer (el método más confiable)

La configuración más limpia es cuando el propio sitio le avisa a GTM que el envío fue exitoso. Un desarrollador agrega un pequeño push en la función que se ejecuta al enviar con éxito. Muchos plugins de formularios tienen un hook o un evento de JavaScript para esto.

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
  event: 'form_success',
  form_name: 'contacto',
  form_location: 'footer'
});

Nunca envíes datos personales como el correo o el teléfono en estos campos. Las políticas de GA4 prohíben enviar información de identificación personal.

Después, en GTM:

1. Ve a Variables > Nueva > Variable de capa de datos. Escribe form_name como nombre. Repite con form_location.
2. Ve a Activadores > Nuevo > Evento personalizado. En Nombre del evento escribe form_success y guárdalo como CE - form_success.

Paso 3: Crea la etiqueta de evento de GA4

Ahora construye una sola etiqueta que envíe el prospecto a GA4. Puedes usarla con cualquiera de los activadores anteriores.

1. Ve a Tags > New > Tag Configuration > Google Analytics > Google Analytics: GA4 Event (evento de GA4).
2. En Measurement ID (ID de medición), escribe G-XXXXXXXXXX (o una variable constante que lo contenga). Si el contenedor ya tiene una etiqueta de Google con ese ID, GTM muestra Google tag found in this container (etiqueta de Google encontrada) y reutiliza su configuración.
3. Nombre del evento: generate_lead. Es un nombre recomendado por GA4, así que los informes lo entienden.
4. En Parámetros del evento, agrega form_name con {{DLV - form_name}} o un valor fijo como contacto.
5. En Activación, elige el activador del Paso 2.
6. Guárdala como GA4 - generate_lead.

1. Usa generate_lead en lugar de un nombre inventado como Formulario Enviado. Los nombres recomendados tienen mejor soporte en los informes de GA4.
2. Los parámetros (en Event Parameters, no visibles en el ejemplo) te permiten separar prospectos por formulario. Regístralos como dimensiones personalizadas en GA4 para verlos en informes.
3. El ejemplo se activa con un activador Custom Event (evento personalizado), que es lo que produce el método de dataLayer del Paso 2D.

Para ver form_name en informes, ve en GA4 a Admin > Data display > Custom definitions (definiciones personalizadas) > Crear dimensión personalizada, con alcance Evento y parámetro form_name.

Paso 4: Prueba el éxito y el error

Haz clic otra vez en Vista previa y corre dos pruebas.

Prueba 1, el envío fallido. Deja vacío un campo obligatorio o escribe un correo inválido. Haz clic en enviar. La etiqueta debe aparecer en Tags Not Fired (etiquetas no activadas).

Prueba 2, el envío exitoso. Llena bien el formulario y envíalo. La etiqueta debe aparecer en Tags Fired (etiquetas activadas) en el evento correcto.

Luego abre en GA4 Admin > Data display > DebugView. Las sesiones de vista previa de GTM se envían en modo de depuración, así que tu dispositivo debe aparecer en Debug Device y mostrar generate_lead con el parámetro form_name.

Qué revisar cuando lleguen los eventos:

1. generate_lead aparece una sola vez, después del envío exitoso, no después del fallido.
2. Haz clic en el evento. Sus parámetros deben tener valores legibles (nada de undefined).

Cuando ambas pruebas pasen, haz clic en Enviar en GTM, ponle un nombre a la versión como «Medición de prospectos del formulario» y Publica.

Paso 5: Márcalo como evento clave

Ve en GA4 a Admin > Data display > Events (eventos). Cuando generate_lead ya se haya recopilado, aparece en la pestaña Recent events (eventos recientes). Haz clic en la estrella junto a él.

Los eventos nuevos pueden tardar hasta un día en aparecer en esa lista. Nuestra guía de eventos clave en GA4 explica los métodos de recuento y la importación a Google Ads.

¿Sigue sin funcionar? Causas comunes

Sobre «Esperar a las etiquetas»

Esperar a las etiquetas retrasa la navegación del formulario hasta que las etiquetas terminan, con un tiempo máximo. En formularios clásicos que recargan la página, puede ayudar a que el hit de GA4 salga antes de que la página se descargue. GA4 usa un método de envío pensado para sobrevivir a la descarga de la página, así que la mayoría de los sitios no lo necesita. Actívalo solo si en tus pruebas se pierden hits.

Formularios de varios pasos

En formularios con varios pasos, marca como evento clave solo el último paso. También puedes enviar un evento form_step con un parámetro step_number si quieres saber dónde abandona la gente.

Cómo confirmar que quedó resuelto

1. Corre ambas pruebas en Vista previa (fallida y exitosa) y guarda capturas de Tag Assistant para tu registro.
2. Revisa DebugView: debe haber un solo generate_lead por cada envío exitoso.
3. Espera 24 horas y abre Informes > Interacción > Eventos para buscar generate_lead.
4. Compara una semana completa de generate_lead con los correos o registros del CRM que recibiste. Una diferencia por consentimiento y bloqueadores es normal. Si hay conteos dobles o muchos más eventos que prospectos, revisa el activador.
5. Vuelve a revisar después de cualquier cambio en el sitio. Un plugin nuevo, una actualización del tema o un rediseño suelen cambiar los ID de formulario y las clases del mensaje de éxito.

Preguntas frecuentes

¿Por qué el activador de envío de formulario de GTM no funciona en mi formulario?

Lo más probable es que tu formulario envíe con AJAX y cancele el envío normal del navegador. GTM nunca ve un evento de envío. Usa el mensaje de éxito o un evento de dataLayer.

¿Mejor uso la medición de formularios de la medición mejorada de GA4?

Sirve para darte una idea general del uso de formularios. No confirma el éxito y se dispara en muchos tipos de formularios, así que no es un buen evento clave. Para contar prospectos, crea un evento generate_lead dedicado.

¿Puedo enviar el correo a GA4 para saber quién convirtió?

No. GA4 no permite información de identificación personal. Usa tu CRM para nombres y correos. Para la coincidencia en Google Ads, revisa las conversiones avanzadas, que cifran los datos con hash.

¿Qué nombre de evento debo usar?

generate_lead es el evento recomendado por Google para formularios de prospectos. Usa sign_up para registros de cuenta o boletín y purchase para pedidos.

¿Necesito una etiqueta por cada formulario?

No. Usa una sola etiqueta y envía form_name como parámetro. Agrega un activador por formulario, o uno solo que coincida con todos.

Fuentes

• support.google.com: /tagmanager/answer/6106716
• support.google.com: /tagmanager/answer/7679316
• support.google.com: /tagmanager/answer/7679410
• support.google.com: /analytics/answer/9216061
• developers.google.com: /tag-platform/tag-manager/datalayer
• analyticsmania.com: /post/google-tag-manager-form-tracking/