Tue. Nov 5th, 2024

#GTMTips: Verificar el ID del contenedor con eventCallback


Cuando utilices el dataLayer.push() comando en una página con un Administrador de etiquetas de Google contenedor, pasas información a GTM modelo de datos internos y potencialmente disparar etiquetas (si el push() contenía un occasion llave). También puedes añadir el eventCallback llave a estos pushes. El valor de esta clave debe ser una función, y esta función se ejecuta una vez que el contenedor termina de procesar cualquier etiqueta que pueda haberse activado en esa dataLayer.push().

Esto es útil si desea darle tiempo a Google Tag Supervisor para completar sus operaciones antes de continuar con otras acciones en la página, por ejemplo.

Sin embargo, hay un problema. Porque Google Tag Supervisor permite agregar varios contenedores a la páginael eventCallback Se llama una vez para cada contenedor particular person en la página.

“Pero no uso varios contenedores en la página”, te oigo exclamar. ¡Bien por ti! Sin embargo, si estás ejecutando un Optimizar Experimente en la página, o si también está cargando gtag.js, eventCallback También se invocará una vez por cada implementación. ¿Por qué? Porque utilizan Google Tag Supervisor como tecnología subyacente.

En este consejo, aprenderemos cómo detectar qué contenedor de Google Tag Supervisor invocó la devolución de llamada y usarlo para deduplicar de manera efectiva la ejecución de nuestro código.


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 74: eventCallback recibe automáticamente el ID del contenedor como argumento del método

El consejo es sencillo (como suelen ser estas cosas). ID de contenedor de Google Tag Supervisor (p.ej GTM-12345) que invocó la eventCallback El método se pasará automáticamente como parámetro a la función que haya configurado como eventCallback.

Si tiene varios contenedores en la página, eventCallback se disparará una vez por cada contenedor, una vez que terminen de disparar, cualquier etiqueta que tenga dataLayer.push() activado. Cada vez que un contenedor invoca el eventCallback método, su ID de contenedor será el argumento.

A modo de ejemplo, supongamos que tengo tres contenedores de Google Tag Supervisor ejecutándose en el sitio.

  1. Contenedor de Google Tag Supervisor con ID GTM-12345

  2. Contenedor de Google Optimize con ID GTM-23456

  3. Biblioteca gtag.js que recopila datos según UA-12345-1

A continuación, ejecutaré el siguiente código en la consola JavaScript:

window.dataLayer = window.dataLayer || ();
window.dataLayer.push({
  occasion: 'GTMEvent',
  eventCallback: perform(containerId) {
    console.log('Container ID: ' + containerId);
  }
});

La salida en la consola se parece a esto:

Container ID: GTM-12345
Container ID: GTM-23456
Container ID: UA-12345-1

Como puede ver, con cada iteración de la devolución de llamada, el ID del contenedor se asignó automáticamente como argumento a la función. Con esta información, es fácil desduplicar su eventCallback método para que sólo reaccione al contenedor “correcto”.

Por ejemplo, aquí quiero ejecutar algún código solo cuando GTM-12345 invoca la devolución de llamada:

window.dataLayer = window.dataLayer || ();
window.dataLayer.push({
  occasion: 'GTMEvent',
  eventCallback: perform(containerId) {
    if (containerId === 'GTM-12345') {
      // Run some code
    }
    // Ignore if not GTM-12345
  }
});

Con solo verificar cuál period el ID del contenedor que se pasó como argumento, es fácil asegurarse de que su eventCallback El código no se ejecuta una y otra vez con cada contenedor adicional en la página.

Related Post

Leave a Reply

Your email address will not be published. Required fields are marked *