#GTMTips: use eventTimeout con eventCallback

Hay momentos en los que estoy decepcionado con Documentación para desarrolladores de Googleespecialmente para Administrador de etiquetas de Google. La mayoría de las veces lo hacen bien, y yo diría que alrededor del 80% de las preguntas que se plantean en los foros se pueden responder simplemente leyendo la documentación. Pero hay algunos casos en los que la documentación es engañosa o incluso francamente peligrosa. Uno de estos casos es Comercio electrónico mejorado.

Esta no será una crítica exhaustiva de dicha documentación, pero el consejo de esta publicación tiene que ver con uno de los ejemplos que da la documentación para medir los clics en productos. En el comentario cube:

…Esta función utiliza la variable eventCallback dataLayer para manejar la navegación después de que los datos de comercio electrónico se hayan enviado a Google Analytics…

Bueno, ese es un excelente caso de uso para eventoDevolución de llamada. Después de todo, su único propósito es ejecutar código. después Todas las etiquetas se han completado para el evento dado en el dataLayer.push carga útil.

Sin embargo, el problema aquí es que está utilizando Google Tag Supervisor para posponer una acción essential, potencialmente perjudicial para la experiencia de usuario y el negocio: la redirección del enlace. El punto del ejemplo es que la redirección del enlace se cancela, y sólo una vez que el eventCallback Si se invoca, la redirección continuará.

Eso, amigos míos, no es un buen patrón.

Si alguna de las etiquetas que se activan en esta carga útil falla, se agota el tiempo de espera o de alguna otra manera no informa a GTM que se ha completado, la redirección nunca se realizará y el usuario queda confundido ya que el enlace en el que intenta hacer clic no No funciona.

ACTUALIZACIÓN IMPORTANTE, 5 de enero de 2018: La última actualización de Firefox para su Protección de seguimiento en navegación privada ahora también bloquea Google Tag Supervisor. Así que incluso eventTimeout no ayudará. Mi sugerencia es no cancelar los clics fuera de Google Tag Supervisor con la intención de realizar la redirección mediante algún método relacionado con Google Tag Supervisor, como eventCallback. (Actualización terminada).

¡Esto es especialmente importante en las versiones recientes del navegador net Firefox! Firefox introdujo algo llamado Protección de seguimiento en navegación privada hace un tiempo, y una de sus características es que bloquea la carga de Google Analytics en la página. Sin embargo, no bloquea Google Tag Supervisor. En otras palabras, se carga Google Tag Supervisor, el dataLayer.push() se procesa y todo, pero si hay incluso una sola etiqueta de Google Analytics que dependa del envío, la eventCallback La función nunca se llama.

Para solucionar este problema, aquí tienes un consejo:

incógnita

El boletín a fuego lento

Suscríbete al Boletín a fuego lento para recibir las últimas noticias y contenido de Simo Ahava en su bandeja de entrada de correo electrónico.

Consejo 48: agregue siempre eventTimeout cuando use eventCallback

Añade siempre el eventTimeout al usar eventCallback. El primero toma un valor numérico como parámetro, que representa el número de milisegundos esperar antes de llamar eventCallback de todos modos. En otras palabras, incluso si sus etiquetas se detiene y nunca indican finalización, después de dos segundos eventCallback es invocado.

Entonces, imaginemos que tienes este código problemático:

var processLinkClick = perform(e) {
  e.preventDefault();
  var targetUrl = e.goal.href;
  window.dataLayer = window.dataLayer || ();
  window.dataLayer.push({
    'occasion' : 'processLink',
    'eventCallback' : perform() {
      window.location = targetUrl
    }
  });
};

Es una función que captura el objeto del evento, evita su acción predeterminada (redireccionamiento), realiza la dataLayer.push()y finalmente en el eventCallback finaliza la redirección. Pero no hay ninguna protección para a) cuando Google Tag Supervisor no está cargado yb) si las etiquetas se bloquean.

Así que aquí está el código fijo:

var processLinkClick = perform(e) {
  var targetUrl;
  if (window('google_tag_manager')) {
    e.preventDefault();
    targetUrl = e.goal.href;
    window.dataLayer = window.dataLayer || ();
    window.dataLayer.push({
      'occasion' : 'processLink',
      'eventCallback' : perform() {
        window.location = targetUrl
      },
      'eventTimeout' : 2000
    });
  }
};

Como puede ver, ahora también estamos comprobando la existencia de google_tag_managerque es la interfaz creada por la biblioteca gtm.js cuando se ejecuta. Entonces, si la biblioteca de Google Tag Supervisor no está cargada, el dataLayer.push() nunca se ejecuta. Claro, puede haber una condición de carrera en la que la biblioteca todavía está en proceso de cargarse, pero también hay formas de mitigarla.

Finalmente, el eventTimeout introduce un tiempo de espera de dos segundos, después del cual se realiza la redirección. Por lo tanto, incluso si alguna etiqueta que se activa en el evento “processLink” se detiene, la redirección no se bloquea.

¡Espero que este consejo te haya sido útil! Hay muchos casos en los que realmente debes tener cuidado de que la configuración de Google Tag Supervisor no afecte la usabilidad de tu sitio net. Este es uno de ellos.