¿El disparador de vista de página no funciona en el GTM? Así es como puedes arreglarlo

¿El disparador de vista de página no funciona en el Administrador de Etiquetas de Google para usted? Yo también tuve este problema y recientemente un estudiante mío me contactó por el mismo tema. Me dijo que no había una respuesta clara en la web, así que decidí publicar una entrada rápida en el blog explicando dónde está el problema y cómo solucionarlo.

El problema

El problema es visible cuando se abre un modo de vista previa y depuración del GTM y se recarga la página. Aparece una consola P&D, pero sólo dos eventos (en lugar de 3) aparecen en ella – DOM Ready y Window Loaded . No hay vista de página. ¿Y qué es ese «Mensaje»?

¿Por qué ocurrió? Sigue leyendo y lo averiguarás.

Ya que queremos disparar nuestra etiqueta de Analítica Universal (o cualquier otra) tan pronto como sea posible, el mejor disparador es Pageview. DOM ready se dispara cuando el HTML del sitio web se renderiza y Window Lo aded se hace disponible sólo cuando todo lo demás (incluyendo Javascript) termina de cargarse.

Si su sitio web se carga demasiado tiempo, los visitantes abandonarán su sitio web antes de los eventos DOM Ready of Window Loaded, por lo que tiene que implementar herramientas de seguimiento de analítica web mediante el uso del disparador Pageview.

La investigación

Toda solución comienza con una investigación. Revisa la premisa y trata de identificar la causa del problema.

Cuando mi alumno me pidió ayuda, abrí su sitio web y accedí a las herramientas para desarrolladores del navegador (en Chrome, ve a Menú > Más herramientas > Herramientas para desarrolladores o haz clic en F12).

Estaba buscando la implementación incorrecta de dataLayer y vi esto:

En realidad hay dos errores cometidos por un desarrollador aquí y los explicaré en el próximo capítulo de esta entrada del blog.

La solución

De acuerdo con las recomendaciones de Google, las variables (que deben pasarse a dataLayer) deben añadirse a un recorte por encima del código de contenedor GTM

Sin embargo, he observado que algunos desarrolladores (que no tienen experiencia con Google Tag Manager) no siguen las recomendaciones de Google (o simplemente no saben que existe tal cosa). Implementan DataLayer de esta manera:

var dataLayer = [{...}];

Como resultado, esto será:

1. Potencialmente romperá el GTM,
2. Hacer que el evento de Pageview no funcione.

En otras palabras – las cosas irán mal.

Actualización: Gracias especiales a Simo Ahava por mencionar otro tema. Él recomienda no usar ni dataLayer = [] ni var dataLayer = []. La solución más robusta es implementar dataLayer de esta manera:

Simo recomienda encarecidamente que se utilice siempre la sintaxis antes mencionada cuando se trabaje con dataLayer, independientemente del lugar del sitio en que se haga (antes del fragmento de contenedor, después del fragmento de contenedor, otro archivo Javascript):

Ahora vamos a volver al caso de mi estudiante.

Hay varios problemas que deben ser abordados:

1. No es necesario iniciar el dataLayer vacío (no hay datos entre los corchetes []) porque el contenedor del Google Tag Manager lo hace automáticamente para usted. En la captura de pantalla de arriba, el dataLayer vacío = [{}]; ha reseteado (y dañado) la capa de datos porque se coloca debajo del contenedor del GTM.
2. Imaginemos que el desarrollador tiene que poner algunos datos en la capa de datos – «registrationCountry». En lugar de esto:

   script> var dataLayer =[{ 'registrationCountry': 'United States' }];Debería haberse hecho

   así:

   = window

   .dataLayer

   || []; window.dataLayer.push({ 'registrationCountry': 'United States' });Siempre usar window.

   dataLayer.

   push en lugar de la declaración dataLayer = []. No romperá el dataLayer (independientemente de dónde se haya producido el empuje (por debajo o por encima del contenedor GTM).

Conclusión

¿El disparador de Pageview no funciona en el modo de vista previa y depuración del Administrador de etiquetas de Google? En ese caso, comprueba si el desarrollador ha añadido correctamente el fragmento de DataLayer a la página web. En esta entrada del blog, expliqué cómo se puede comprobar fácilmente si el desarrollador hizo bien su trabajo.