Una de las mejores maneras de aprovechar Administrador de etiquetas de Google En el seguimiento de su análisis net se trata de aprovechar todos los datos posibles. eventos personalizados que el navegador tiene para ofrecer. Uno de esos eventos es beforeunload
Se envía en el navegador cuando el usuario está a punto de… descargar la página. Esto significa, por lo common, que el usuario está a punto de abandonar la página después de hacer clic en un enlace o que está a punto de salir del navegador cerrando la pestaña o la ventana entera.
Podemos usar este evento para muchas cosas, pero en este artículo te mostraré cómo configurar el oyente y luego usarlo para enviar un evento a Análisis de Google que contiene el lo más profundo umbral de profundidad de desplazamiento El usuario cruzó la página. Por lo tanto, si se desplazó hasta el 75 % del documento, este evento enviaría ese umbral a Google Analytics. ¿Por qué? Porque a veces simplemente queremos saber el más lejano El usuario se desplazó a una página determinada, en lugar de todo los umbrales que cruzaron en el camino hacia allí.
incógnita
El boletín informativo de Simmer
Suscríbete a la Boletín informativo de Simmer ¡Para recibir las últimas noticias y contenidos de Simo Ahava en tu bandeja de entrada de correo electrónico!
Consejo 82: Dispara un gatillo en el beforeunload
evento
En primer lugar, vamos a crear el detector de eventos para beforeunload
para que los lectores impacientes puedan seguir adelante y comenzar a trabajar en sus propias soluciones en torno a este detonante.
Uno importante Lo que hay que tener en cuenta es que si se utiliza un
beforeunload
oyente, invalidas la Caché hacia atrás y hacia adelante de algunos navegadores (por ejemplo, Firefox). En algunos sitios net, esto puede afectar la experiencia del usuario, por lo que es recomendable consultar con los desarrolladores antes de implementarlo, en specific en páginas con formularios.
La etiqueta es easy Etiqueta HTML personalizada que dispara en el Todas las páginas Activador. Si quieres que el oyente esté activo solo en páginas específicas, puedes usar un activador más restrictivo.
A continuación el contenido:
<script>
window.addEventListener('beforeunload', operate() {
window.dataLayer.push({
occasion: 'beforeunload'
});
});
script>
Todo lo que hace esta etiqueta es crear el receptor. El receptor tiene una devolución de llamada que envía el beforeunload
evento personalizado en dataLayer
.
Ahora, si va al modo Vista previa, al hacer clic en un enlace fuera de cualquier página, debería… justo ver el antes de descargar El texto aparece en la lista de eventos del modo Vista previa antes de que te retiren. Si lo ves, significa que el oyente funciona.
El siguiente paso es crear un Activador de evento personalizado con la siguiente configuración:
Si agrega este disparador a una etiqueta, esa etiqueta se activará justo cuando el usuario está a punto de abandonar la página.
Establecer el transport
campo en las etiquetas de Google Analytics
Debido a que el disparador se activa en el umbral de descarga de la página, existe un riesgo muy actual de que la página se descargue. antes La solicitud asincrónica iniciada por la etiqueta (que se activa en el disparador) tiene tiempo para completarse. Para que sus solicitudes se completen a tiempo, puede usar el API de baliza – otra característica interesante del navegador que es casi esencial para el seguimiento del análisis net.
Afortunadamente, si utiliza etiquetas de Google Analytics, no necesita crear la utilidad de baliza usted mismo. La biblioteca Common Analytics, análisis.jstiene un campo especial llamado transport
que puedes establecer en el valor beacon
en caso de que desee aprovechar la API de Beacon con sus visitas de Google Analytics.
Para agregar este campo, utilice un Variable de configuración de Google Analyticso anule la configuración de su etiqueta. Desplácese hacia abajo hasta Campos a configurary agrega un nuevo campo:
Nombre del campo: transport
Valor: beacon
Con esta configuración, la etiqueta ahora utiliza la API Beacon para enviar la solicitud asincrónica incluso si El navegador ha descargado la página. Lo bueno de esta implementación es que si el navegador no admite esta API, la etiqueta vuelve automáticamente a GET o POST, como lo haría normalmente.
Un “efecto secundario” de usar la API Beacon es que la solicitud se convierte automáticamente en una solicitud POST. Esto significa que si está usando la pestaña Pink de las herramientas para desarrolladores de su navegador, los parámetros de la solicitud no se delinearán tan bien como lo harían con una solicitud GET. Por este motivo, le recomiendo encarecidamente que use la Depurador de Google Analytics para analizar las solicitudes.
Enviar el umbral de profundidad de desplazamiento más profundo
Para enviar lo más profundo (o lo más lejos) que el usuario se ha desplazado en una página determinada, necesita los siguientes componentes.
Un disparador de profundidad de desplazamiento con los umbrales configurados
Tenga en cuenta que usted no Es necesario agregar este disparador a cualquier etiqueta. Su único propósito es impulsar los valores de umbral a dataLayer
.
Una etiqueta de Google Analytics que se activa en el beforeunload
desencadenar
La etiqueta debe activarse en el beforeunload
disparador, y necesita enviar el valor del {{Umbral de profundidad de desplazamiento}} Variable incorporada a Google Analytics. No olvides añadir el transport
¡Allí también hay campo!
Nuevamente, no dude en agregar excepciones de activación o modificar la activación de evento personalizado para restringir esta etiqueta a fin de que se energetic solo en páginas relevantes. No tiene sentido recopilar datos de desplazamiento en páginas donde esa información no es relevante.
Resumen
Una vez que haya creado la etiqueta HTML personalizada para el receptor, el activador de evento personalizado, el activador de profundidad de desplazamiento y la etiqueta de Google Analytics, estará listo. Cuando el usuario esté a punto de abandonar cualquier página, la etiqueta beforeunload
El evento activa la etiqueta de Google Analytics. Esta etiqueta obtiene el último valor de {{Umbral de profundidad de desplazamiento}} y lo envía con el evento a GA.
Entonces, si el usuario se desplazó hasta el 70 % de la página (si lo configuró como un umbral vertical en la configuración del disparador), el valor 70
Se enviaría con la etiqueta.
De esta manera conservarás tu cuota de visitas (recuerda que hay una 500 visitas por sesión límite en Google Analytics) y evitará enviar mucha información ruidosa sobre los umbrales intermedios a Google Analytics.
Sin embargo, el truco de la profundidad del desplazamiento fue solo una tangente. beforeunload
El oyente se puede utilizar para un millón de cosas diferentes, como por ejemplo: abandono de formulario y Compromiso con el contenido seguimiento.
¿Tienes otros usos interesantes para el? beforeunload
¿Eres un oyente? ¡Cuéntanoslo en los comentarios!