Tracking de Popup con Google Tag Manager (GTM)

Te enseño, paso a paso, cómo medir la apertura de un PopUp (ventana emergente) con Google Tag Manager, y pasarle el Evento a Google Analytics.

• Tiempo de implementación: 7/8 min
• Nivel de dificultad: Fácil

Supongamos que este fuera el código del Pop-Up:

<main id="feedback-message-popup">
    <p class="title-primary title--font-subtle spacing--margin-bottom-xs">
        <?php _e('Thank you very much!', 'mycustomtheme'); ?>
    </p>
    <p class="title-secondary title--font-subtle response-message">
        <?php _e('Thank you very much for reaching out. We'll get back to you shortly to assist further and provide any information needed.<br><br>We appreciate your trust in us.<br><br>Warm regards,<br>Our Team', 'mycustomtheme'); ?>
    </p>
</main>

Solución: Ya que estás mostrando un pop-up, puedes usar el activador de “Elemento visible” en GTM.

1. Utilizar el Activador de “Elemento visible”

1. Dentro de tu cuenta de GTM, ve a “Activadores” y crea un nuevo activador.
2. Elige “Elemento visible” como el tipo de activador.
3. Configura los siguientes campos:
   • Seleccionador CSS: main#feedback-message-popup (esto apunta al ID del pop-up)
   • Porcentaje de visibilidad mínima: Puedes elegir el porcentaje que prefieras, pero un valor de 50 podría funcionar en la mayoría de los casos. Esto significa que cuando al menos el 50% del pop-up es visible, se activará el disparador.
   • Intervalo de comprobación: Esta es la frecuencia con la que GTM verifica la visibilidad del elemento. Un valor de 500 milisegundos suele ser adecuado.
   • Máximo de observaciones: 1 (esto es útil si solo quieres que el activador se dispare una vez por página cargada).

2. Vincular el Activador a una Etiqueta

1. Ahora que tienes el activador, crea una nueva “Etiqueta” para enviar un evento a Google Analytics (o cualquier otra acción que desees).
2. Elige “Google Analytics: Universal Analytics” o “Google Analytics: GA4 Event” como tipo de etiqueta, según tu versión de Google Analytics.
3. Configura la etiqueta con la acción que deseas (por ejemplo, enviar un evento con la categoría “Formulario”, la acción “Enviado” y la etiqueta “Pop-up”).
4. En la sección “Activadores”, selecciona el activador que acabas de crear.

3. Publica los cambios en GTM

Una vez que hayas configurado tanto la etiqueta como el activador, no olvides publicar los cambios en GTM para que los mismos se reflejen en tu sitio web. Es recomendable probar el activador y la etiqueta en el “modo vista previa” de GTM antes de publicar, para asegurarte de que todo funcione correctamente.