Cómo rastrear envíos de formularios de Paperform con Google Analytics 4

Si gestionas un sitio web que utiliza formularios de Paperform y deseas hacer un seguimiento de las envíos de estos formularios como eventos de conversión en Google Analytics, has llegado al lugar adecuado. En este artículo, te daré una guía completa sobre cómo implementar esta medición, incluyendo cómo abordar el análisis de formularios de varios pasos para mejorar tu análisis de embudos de conversión.

Paperform es una herramienta en línea que permite crear diversos tipos de formularios web, incluyendo encuestas, pagos, reservas y más. Esta plataforma se asemeja a otras herramientas populares como Gravity Forms y Typeform, pero se distingue por su interfaz intuitiva y la capacidad de crear formularios dinámicos. La medición de los envíos de formularios no solo proporciona información valiosa sobre la interacción de los usuarios, sino que también puede ayudar a optimizar tus estrategias de marketing digital.

¿Por qué realizar un seguimiento de los envíos de formularios?

El seguimiento de los envíos de formularios es vital por varias razones:

• Mejora del rendimiento: Al conocer cuáles formularios están funcionando mejor, puedes optimizar los menos efectivos.
• Comprensión del comportamiento del usuario: Analizar cómo los usuarios interactúan con tus formularios ofrece información sobre su experiencia y preferencias.
• Optimización de embudos de conversión: Al rastrear cómo los usuarios completan formularios de varios pasos, puedes identificar y eliminar obstáculos que impiden el envío.

Implementación del seguimiento de envíos de Paperform en Google Analytics 4

Para rastrear envíos de formularios de Paperform como eventos de conversión en Google Analytics 4 (GA4), necesitarás implementar dos componentes clave: listeners de eventos de Paperform y un contenedor de Google Tag Manager (GTM).

Comenzaremos analizando el seguimiento de envíos de formularios exitosos y luego pasaremos a medir la finalización de cada paso en formularios de múltiples etapas.

Seguimiento de envíos exitosos de formularios Paperform

Para rastrear los envíos de formularios, utilizaremos un listener de eventos de Paperform. Este listener se activa cuando ocurre una acción relevante, como el envío de un formulario. Aquí tienes un ejemplo del código que debes implementar:

<script>
// Se activa al enviar exitosamente un formulario de Paperform
window.addEventListener('PaperformSubmission', function(e) { 
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
  'event': 'paperformSubmissionEvent',
  'eventType': e.type,
  'form_ID': e.detail.form_id,
  'submission_ID': e.detail.submission_id,
  'event_timestamp': e.timeStamp,
  'formData': e.detail.data
});
})

// Se activa al cambiar de paso en un formulario de Paperform
window.addEventListener('PaperformPageChange', function(e) { 
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
  'event': 'paperformStepChange',
  'eventType': e.type,
  'form_ID': e.detail.form_id,
  'paperForm_Step': e.detail.currentPage,
  'paperForm_Total_Step': e.detail.totalPages,
  'event_timestamp': e.timeStamp
});
})
</script>

Este código debe ser agregado como una nueva etiqueta en tu contenedor de Google Tag Manager, seleccionando “HTML personalizado” como tipo de etiqueta. Además, necesitarás configurar un disparador que permita que esta etiqueta se ejecute en el momento adecuado, siendo recomendable utilizar el disparador DOM Ready.

¿Qué es un listener de eventos y cómo funciona?

Un listener de eventos en JavaScript es una función que espera a que ocurra un evento específico y luego reacciona en consecuencia. En este caso, estamos utilizando un listener para captar eventos de envío de formularios y cambios de paso. Cuando se produce cualquiera de estos eventos, se envían datos a la capa de datos, que luego se utilizarán en Google Tag Manager para activar las etiquetas de GA4 y proporcionar información adicional sobre el formulario que se ha completado.

El código anterior escucha dos eventos:

1. [paperformSubmissionEvent]: Se activa al enviar exitosamente un formulario.
2. [paperformStepChange]: Se activa al completar un paso en un formulario de múltiples etapas.

Configuración de un disparador para el evento de envío de Paperform

Para crear un disparador en Google Tag Manager que active la etiqueta de GA4 cuando se envía un formulario, dirígete a la sección “Disparadores” y selecciona “Nuevo”. En la configuración, elige el tipo “Evento personalizado” y nombra el evento como “paperformSubmissionEvent”. Guarda el disparador.

Variables de DataLayer para un contexto adicional

Además de establecer un disparador, es importante crear variables que añadan contexto sobre el envío de formularios. A continuación se presentan las claves disponibles en el DataLayer que puedes utilizar:

• [form_ID]: ID del formulario que se acaba de enviar.
• [submission_ID]: Identificador único para cada envío del formulario.
• [event_timestamp]: Marca temporal del evento de envío.
• [paperForm_Step]: Indica el paso actual en un formulario de múltiples etapas.
• [paperForm_Total_Step]: Total de pasos en el formulario.

Creación de una etiqueta de evento GA4 para envíos de Paperform

A continuación, crea una etiqueta de evento en Google Tag Manager para comunicar a Google Analytics que se ha enviado un formulario. Navega a la sección de “Etiquetas” y selecciona “Nuevo”. Luego, elige el tipo de etiqueta “Google Analytics: GA4 Event”.

En la configuración de la etiqueta, introduce el ID de medición de tu GA4 y establece el nombre del evento, que en este caso será “generate_lead”. Agrega parámetros de evento como “form_id” y “form_submission_id” para ofrecer contexto adicional sobre el envío.

Recuerda vincular el disparador creado anteriormente a esta etiqueta. Una vez que hayas configurado todo, no olvides probar tu implementación utilizando Google Tag Assistant.

Medición de formularios de múltiples pasos con GA4

Si deseas realizar un seguimiento no solo de los envíos, sino también de los cambios de paso en formularios de múltiples etapas, necesitas crear un nuevo disparador en GTM. Este disparador será de tipo “Evento personalizado” y llevará el nombre “paperformStepChange”.

También deberás crear variables que te informen sobre el paso actual y el total de pasos en el formulario. Utiliza las claves paperForm_Step y paperForm_Total_Step para obtener esta información. Para capturar el número de pasos completados, puedes crear una variable de tipo JavaScript personalizado que reste uno al paso actual.

function() {
  var paperformCurrentStep = {{DLV - PaperForm - paperForm_Step}};
  return parseInt(paperformCurrentStep) - 1;
}

Plantilla de GTM para Paperform

Para facilitar el proceso, he creado una plantilla de Google Tag Manager que puedes descargar. Esta plantilla te permitirá importar fácilmente la configuración para el seguimiento de envíos de formularios y cambios de paso como eventos de Google Analytics en tu propio contenedor de GTM, ahorrándote tiempo en la implementación.

Consideraciones finales sobre el seguimiento de Paperform con GA4

Es importante recordar que el listener de eventos de Paperform no se limita solo al seguimiento de eventos de conversión en GA4; también puede usarse para rastrear envíos exitosos en varias plataformas de publicidad, incluidas Google Ads y Meta Ads.

Si deseas realizar un seguimiento específico de ciertos formularios, considera el uso de condiciones en los disparadores basadas en el ID del formulario o la información de la página. Esto te permitirá enfocarte en los formularios que realmente importan para tu negocio.

Te invito a compartir tus experiencias con Paperform y el seguimiento de envíos en la sección de comentarios. ¡Feliz medición!