Funnel de Venta
Google Analytics
Rastrea muchos formularios con una página de agradecimiento con el Google Tag Manager

Rastrea muchos formularios con una página de agradecimiento con el Google Tag Manager

Aquí hay un ejemplo: quieres hacer un seguimiento de las presentaciones de formularios en un sitio web. Hay múltiples formularios y todos redirigen al visitante a la misma página de «Gracias». El disparador de envío de formularios incorporado en el GTM no funciona, por lo que podría intentar implementar el método de seguimiento de la página de agradecimiento. ¿Pero cómo se puede distinguir qué formulario fue enviado?

En esta guía, mostraré varias opciones sobre cómo hacer el seguimiento de muchos formularios con una página de agradecimiento (en otras palabras, que redirigen a la misma página de «Gracias»).

Tabla de contenidos

Opción 1. Usando la variable de referencia

Este método es útil si sólo hay un formulario por página.

Si la página con un formulario y la página de agradecimiento son del mismo subdominio, es muy probable que puedas utilizar una variable de referencia incorporada en el Administrador de etiquetas de Google. Esta variable devuelve el valor de la página anterior.

Sin embargo, ten en cuenta que esta variable es cada vez más limitada (debido a las implicaciones de privacidad). Si tu página de agradecimiento se encuentra en otro dominio, es posible que el Remitente no devuelva una URL completa, lo que significa que no podrás distinguir de qué página exacta aterrizó el visitante.

Para comprobar si este método funciona (lo ideal es hacerlo en varios navegadores):

Habilitar el modo de vista previa y depuración del GTM
Actualiza la página web con el formulario que estás a punto de rastrear
Envíe el formulario (y será redirigido a una página de agradecimiento)
Compruebe el evento Contenedor cargado en el modo de vista previa > vaya a la pestaña Variables de la consola de depuración y compruebe el valor del Remitente

¿Puedes decir (mirándolo) desde qué página exacta aterrizó el visitante en una página de «Gracias»? Si es así, entonces este método es exactamente lo que necesitas. Si no, salta a la opción #2.

Es hora de hacer un seguimiento del envío del formulario. Digamos que el URL de la página de «Gracias» es este https://www.example.com/thank-you/. Vamos a crear un disparador.

#1.1. Crear un disparador

En GTM, vaya a Tags > New > Pageview e introduzca las siguientes condiciones:

La ruta de la página comienza con /gracias
El referenciador contiene www.example.com (reemplácelo por el dominio de su sitio web). Esto es opcional pero si alguien accidentalmente aterriza en una página de «Gracias» de la búsqueda de Google o en algún otro lugar (no de la otra página de mi sitio web), esta condición evitará que la etiqueta se dispare.

#1.2. Crear una etiqueta de Google Analytics

En GTM, vaya a Tags > New > Universal Analytics e introduzca los siguientes ajustes:

Puede usar una convención de nombres diferente si lo desea. Lo principal aquí es que en la acción del evento, estamos enviando la URL de la página anterior (en la que se envió el formulario).

Si desea rastrear sólo la ruta del remitente (no el URL completo), puede crear una variable URL con los siguientes ajustes y utilizarla en su etiqueta GA en su lugar.

#1.3. Pruebe la configuración

Guarda todos los cambios, actualiza la vista previa del GTM y el modo de depuración, y envía el formulario una vez más. Luego vaya a los informes en tiempo real de Google Analytics y compruebe si ve el evento en Tiempo real > Eventos.

Nota: si establece el «golpe de no interacción» en true, podrá ver los datos del evento en tiempo real sólo en la sección «Últimos 30 minutos».

Después de que compruebes y te asegures de que todo funciona correctamente, no te olvides de publicar el contenedor.

Opción 2. ¿Trabajar con una aplicación de una sola página? Utilice los grupos de activación

Nota: la solución que estoy a punto de mostrarte no es muy escalable (a menos que puedas pedirle a un desarrollador que pase alguna información adicional a la Capa de Datos. Más sobre eso – más tarde). Si sólo tienes varias formas y no se espera que el número de ellas crezca rápidamente, adelante y úsalo. De lo contrario, pasa a otro método.

Si se trata de una aplicación de una sola página, entonces puede considerar el uso de Grupos Activadores. Esta característica le permite combinar varios disparadores. Si todos se disparan en la misma página, entonces el grupo de disparadores se activa y todas las etiquetas asociadas se activan también.

Esta es la idea principal:

Un visitante aterriza en una «página» del formulario de su SPA. El disparador A se activa.
Un visitante aterriza en una página de «Gracias». El disparador B está activado.

Si incluimos ambos disparadores en un solo grupo de disparadores, entonces su etiqueta de evento GA podría dispararse.

La razón por la que pongo la palabra «página» entre comillas es que el rastreo de aplicaciones de una sola página normalmente involucra vistas de páginas virtuales. Cada vez que un visitante navega de una sección de su SPA a otra, una vista de página virtual es enviada a Google Analytics.

Hay varias maneras de cómo esto puede ser implementado.

Imaginemos que en mi caso, le he pedido a un desarrollador que empuje la información de cada página a la Capa de Datos. Esa información se ve así:

window.dataLayer = window.dataLayer || [];window.dataLayer.push({ 'evento' : 'virtualPageview', 'pageTitle' : 'Algún título de página', 'pagePath' : '/pages/some-page-with-form'});

Luego he creado dos variables de Capa de Datos (para la ‘pagePath’ y ‘pageTitle’) y un Disparador de Eventos Personalizados para la ‘virtualPageview’.

Ese disparador de eventos personalizados dispara una etiqueta GA de vista de página en cada «virtualPageview». Pero en nuestro caso (de rastrear múltiples formularios y una sola página de agradecimiento), esto es demasiado amplio. Tenemos que ir más profundo.

Imaginemos una cosa más en este ejemplo. Hay dos páginas virtuales con formularios:

/páginas/download-an-ebook/
/páginas/ descargar una lista de control/

…y una página de «Gracias» /páginas/ gracias/.

#2.1. Disparadores

Ahora, vamos a crear los disparadores (advertencia: tendrás que adaptar la configuración de los disparadores a tu proyecto porque hay mucha flexibilidad/unicidad en las configuraciones de cada SPA). Uno para la página de «Gracias»:

Y luego crear uno para CADA formulario. Aquí hay un ejemplo de un disparador. Básicamente, sólo introduzco el nombre del evento personalizado que representa una vista de página virtual y luego lo hago más preciso introduciendo la URL del formulario (pagePath o lo que sea que esté usando en su configuración)

#2.2. Grupos de disparo

Entonces es el momento de los grupos de disparo. Ya que tenemos dos formas, necesitaremos dos grupos de disparo. Ve a «Gatillos» > Nuevo > Grupo de gatillo. Aquí hay un ejemplo de un grupo de gatillo. En él, incluí dos disparadores: uno para la página de «Gracias» y otro para la vista de página relacionada con una forma específica.

Tendrá que crear un grupo de disparadores separado para CADA formulario que desee rastrear en su Aplicación de una sola página.

#2.3. Etiquetas

Luego, finalmente, crear dos etiquetas (una para cada formulario). Cuantos más formularios tengas, más etiquetas tendrás que crear. Asigna una etiqueta a un grupo de activación.

#2.4. Pruebe la configuración

Nota: si establece el «golpe de no interacción» en true, podrá ver los datos del evento en tiempo real sólo en la sección «Últimos 30 minutos».

Después de que compruebes y te asegures de que todo funciona correctamente, no te olvides de publicar el contenedor.

Como puede ver, esta configuración no es muy escalable y puede desordenar rápidamente su contenedor si tiene muchos formularios. Por ejemplo, si tienes 10 formularios, necesitarías crear 11 disparadores, 10 grupos de disparadores y 10 etiquetas. No es una solución ideal 🙂

Pero para los sitios web pequeños, esto todavía podría ser una opción.

Opción 3. Otra solución para aplicaciones de una sola página

Esto depende de cómo se rastrean las páginas virtuales con el GTM. Si está usando el disparador de cambio de historia, es probable que ya tenga información sobre la página anterior en la capa de datos. O tal vez su desarrollador ya está empujando la información de la página anterior a la Capa de Datos?

Sin embargo, esto depende en gran medida de cómo esté codificado su SPA.

De todos modos, abra su Solicitud de Página Única, envíe el formulario, y cuando se mueva a la página de «Gracias», revise la pestaña de la Capa de Datos de su modo de Vista Previa y Depuración.

¿Ve algo relacionado con la página anterior con un formulario?

Si es así, utilice la variable Capa de datos para obtener ese valor. ¿O tal vez las variables incorporadas Fragmento de Historia Antigua o Estado de Historia Antigua funcionan para usted? Si es así, entonces:

Cree un Disparador de Eventos Personalizados (o disparador de cambio de historial – esto depende de su configuración existente) que se dispare cuando el visitante vea esa página de «Gracias». Consulta el capítulo anterior de esta entrada de blog para obtener más información.
A continuación, crea una etiqueta de evento GA, configúrala para que se dispare en el disparador de eventos personalizados que acabas de crear. Además, en el campo Acción o etiqueta de evento, inserte la variable que devuelve la información sobre la página anterior que vio el visitante (me refiero a la variable de la capa de datos o a una de las variables del historial).

#3.1. Pruebe la configuración

Nota: si establece el «golpe de no interacción» en true, podrá ver los datos del evento en tiempo real sólo en la sección «Últimos 30 minutos».

Después de que compruebes y te asegures de que todo funciona correctamente, no te olvides de publicar el contenedor.

Opción 4. Almacenar la información del último formulario enviado en una cookie

Este método funciona si una página de agradecimiento está en el mismo dominio que la página donde se presentó el formulario. Los subdominios no importan. Si el formulario está disponible en www.example.com y la página de agradecimiento está en app.example.com, está bien.

Además, este método es útil si el Referente, por alguna razón, no está disponible o simplemente no nos da suficiente información.

Esto es lo que haremos:

Cuando se envíe un formulario, almacenaremos cierta información sobre el formulario enviado en una cookie. Ejemplos: URL donde el formulario está disponible, ID del formulario, etc.
Cuando un visitante llega a una página de agradecimiento, leeremos la cookie y usaremos esa información en nuestra etiqueta GA.

La razón por la que no estoy usando localStorage es que está limitado a un solo subdominio. Y a veces, las páginas de agradecimiento están alojadas en un subdominio diferente del mismo dominio.

#4.1. Poner la cookie

Hay varias formas de configurar la cookie en el Administrador de etiquetas de Google (Etiqueta HTML personalizada, Plantilla personalizada). En este caso, usaré la etiqueta HTML personalizada.

Necesitamos insertar algún valor sobre el formulario en este código. ¿Qué tipo de información tienes? Si sólo hay un formulario por página, puedes usar la variable Page Path. Si tienes otra variable útil, no dudes en usarla.

El código final con la información de {{Page Path}} se verá así

Este código establecerá la cookie que expirará en 24 horas (a menos que el visitante envíe otro formulario – entonces el valor anterior será sobrescrito).

Puede disparar este código cuando, por ejemplo, se hace clic en el botón de envío.

Lo sé, normalmente defiendo que rastrear formularios con el Click Trigger es una idea terrible, pero en este caso, no estamos enviando ningún dato a GA todavía. Sólo estamos almacenando la información sobre la intención más reciente de enviar un formulario.

Aquí hay un ejemplo del Disparador de Clic (si la clase del botón es form-submit-button). Más información sobre el seguimiento de los clics.

Sí, el ejemplo anterior puede ser demasiado amplio. Tener un ID en un botón sería una opción mucho mejor (o algunos atributos de datos adicionales) pero mire esto más como una prueba de concepto. Asigna este activador a la etiqueta HTML personalizada.

#4.2. Revisa la cookie

Después de haber guardado el disparador y la etiqueta, habilita/actualiza el modo de vista previa y depuración en el GTM y comprueba si esto funciona. Haga clic en un botón de envío de formularios.

La etiqueta HTML personalizada debe activarse en un evento de clic. En caso afirmativo, abre las herramientas de desarrollo de tu navegador y ve a Aplicación > Almacenamiento > Cookies > Selecciona tu dominio. A continuación, introduce gtm_formInfo en la barra de búsqueda y comprueba si la cookie está ahí.

Nota: la captura de pantalla anterior está tomada de mi Chrome. Otros navegadores tendrán una interfaz/nombre un poco diferente.

#4.3. Crear una variable de la cookie de 1st party en el Administrador de etiquetas de Google

Ve a Variables > Nuevo > Variable de Galletas de Primera Parte e introduce los siguientes ajustes (distingue entre mayúsculas y minúsculas):

Esta variable leerá la cookie que acabas de establecer en la sección anterior de este artículo.

#4.4. Crear un disparador

Crear un disparador de Pageview que se activará en una página de «gracias». Digamos que la URL de su página de agradecimiento es example.com/pages/thank-you/. En ese caso, la configuración del disparador podría verse así:

#4.5. Crear una etiqueta

Por último, pero no menos importante, la etiqueta. Necesitamos enviar los datos de envío del formulario a Google Analytics. Cuando un visitante llega a una página de «Gracias», el disparador activará la etiqueta. Aquí están los ajustes de esa etiqueta:

Puedes usar una convención de nombres diferente si lo deseas. Asigne el disparador de Pageview previamente creado a esta etiqueta.

Entonces, para resumir: cuando un visitante hace clic en el botón de envío de formularios, guardaremos la ruta de la página en una cookie. Cuando el visitante llegue a una página de «Gracias», tomaremos la información de esa cookie y la usaremos en la etiqueta de evento de la AG.

#4.6. Pruebe la configuración

Nota: si establece el «golpe de no interacción» en true, podrá ver los datos del evento en tiempo real sólo en la sección «Últimos 30 minutos».

Después de que compruebes y te asegures de que todo funciona correctamente, no te olvides de publicar el contenedor.

Opción 5. ¿Puedes cambiar el URL de la página de agradecimiento tú mismo?

El siguiente método de seguimiento es una buena opción si:

Está utilizando un plugin de formulario flexible que le permite cambiar el URL de una página de «Gracias» en cada uno de los formularios individualmente.
Y el número de nuevos formularios no está creciendo muy rápidamente
Y si el número de formas existentes no es muy alto…

Entonces, este es el trato. Seguirás usando la misma página de «Gracias». Pero en lugar de una dirección /gracias/ normal, también le agregarás un parámetro URL, por ejemplo formName. Mientras que la página de «Gracias» es la misma, el URL será ligeramente diferente para cada formulario.

Por ejemplo, si tienes una página de agradecimiento cuyo URL es example.com/pages/thank-you/ pero tienes 5 formularios, el URL de la página de agradecimiento de cada formulario podría verse así:

example.com/pages/thank-you/?formName=form1
example.com/pages/thank-you/?formName=form2
example.com/pages/thank-you/?formName=form3
example.com/pages/thank-you/?formName=form4
example.com/pages/thank-you/?formName=form5

Puedes elegir cualquier otro (valor más significativo) en lugar de sólo «forma1». Lo que vamos a hacer a continuación es crear una Variable URL que devolverá el valor de formName y lo usaremos en la Etiqueta de Evento GA.

Ahora revisa todos los formularios de tu sitio web y cambia el URL de la página de «Gracias». No daré instrucciones aquí porque cada plugin de formulario o sistema de gestión de contenidos (CMS) requerirá diferentes pasos.

#5.1. Crear una variable URL

En GTM, vaya a Variables > Nuevo > Variable URL e introduzca los siguientes ajustes:

Si utiliza un nombre de parámetro diferente (en lugar de formName), introdúzcalo en los ajustes de la variable.

#5.2. Crear un Trigger

Una vez más, usaremos el mismo disparador de Pageview que mencioné varias veces en las secciones anteriores. Si seguimos el ejemplo de la URL que mencioné anteriormente(https://example.com/pages/thank-you/), la configuración del disparador podría verse así:

#5.3. Crear una etiqueta

Vaya a Tags > New > Universal Analytics e introduzca los siguientes ajustes:

Esta etiqueta se disparará cuando un visitante aterrice en una página de «Gracias». En el campo «Acción de Eventos», inserté la variable URL creada previamente. Devolverá el valor del parámetro formName que es visible en la URL de cada página de agradecimiento.

#5.4. Pruebe la configuración

Nota: si establece el «golpe de no interacción» en true, podrá ver los datos del evento en tiempo real sólo en la sección «Últimos 30 minutos».

Después de que compruebes y te asegures de que todo funciona correctamente, no te olvides de publicar el contenedor.

Opción 6. Cooperar con los desarrolladores

Si ninguna de las opciones mencionadas anteriormente le ha funcionado, debería pedir ayuda al promotor. Aquí hay varias opciones que se me ocurren en este momento:

Cuando esto esté hecho, entonces deberías crear un disparador de eventos personalizado, Variable de la Capa de Datos y una etiqueta de Evento GA.

Ajustes del Custom Event Trigger:

Trigger title – custom – formSubmission
Nombre del evento – formSubmission
Disparar sobre todos los eventos personalizados

Los ajustes de la Variable de la Capa de Datos:

Título – dlv – formName
Capa de datos Nombre de la variable – formName
Versión 2

Finalmente, cree la Etiqueta de Evento GA con la siguiente configuración, asigne el Disparador de Evento Personalizado creado previamente, inserte la Variable de la Capa de Datos (está rodeada por {{ }})

#6.1. Pruebe la configuración

Nota: si establece el «golpe de no interacción» en true, podrá ver los datos del evento en tiempo real sólo en la sección «Últimos 30 minutos».

Después de que compruebes y te asegures de que todo funciona correctamente, no te olvides de publicar el contenedor.

¿Dónde puedo encontrar estos datos en mis informes habituales de Google Analytics?

Todos estos eventos aparecerán en Comportamiento > Eventos > Descripción general y, a continuación, haga clic en el enlace Ver informe completo.

Cómo realizar el seguimiento de varios formularios con una página de agradecimiento: Palabras finales

Y ahí lo tienes. Si se trata de múltiples formas que redirigen a un visitante a la misma página de «Gracias», con suerte, uno de estos métodos ayudará.

Personalmente, yo trataría de trabajar con la variable Referrer primero (porque requiere menos trabajo en comparación con otros métodos).

Si eso no funciona, entonces me decantaría por almacenar la información en una cookie o editar las direcciones URL de una página de agradecimiento (añadiendo algún parámetro). O seguir buscando la información sobre la página anterior en la capa de datos.

Si nada de eso funcionara, entonces probablemente cooperaría más estrechamente con los desarrolladores.

Otros métodos deben ser considerados como el plan B.