Blog

¿Qué es Google Tag Manager y cómo funciona?

Google Tag Manager

Se trata de una herramienta gratuita lanzada por Google, que consiste en un “contenedor” en el cual metemos etiquetas que nos permiten trackear lo que hace el usuario en nuestra página web o en nuestra app.

Componentes básicos de Google Tag Manager

Para poder entender cómo funciona y para qué sirve GTM debemos definir sus cinco componentes básicos:

  • Cuenta de Gmail: es el lugar dónde se centralizará toda la información obtenida con GTM, esta poseerá in identificador único (ID) que nos permitirá reconocerla fácilmente
  • Contenedores: son las áreas de trabajo que funcionan en base a las etiquetas, los activadores y las variables y que nos permiten clasificar la información de GTM. Dentro de la misma cuenta de Google Tag Manager podemos tener varios contenedores, lo cual es muy útil para empresas que poseen varias tiendas online, ya que permite gestionarlas todas desde un mismo lugar
  • Etiquetas: son fragmentos de código JavaScript que incluimos en nuestra web/app, y que nos permiten enviar información a sistemas externos para realizar la medición o acción deseada. Estas “etiquetas” se pueden crear a través de plantillas facilitadas por el propio programa o de manera personalizada dependiendo de lo que deseemos trackear
  • Activadores: también conocidos como triggers, son las condiciones o características que se deben dar para que la etiqueta salte; por ejemplo si hacemos un click en un enlace
  • Variables: son los valores estáticos o dinámicos que se utilizan en los activadores y en las etiquetas para obtener los resultados deseados

¿Cómo se implementa Google Tag Manager?

Para poder trackear la navegación del usuario en la web debemos hacer una buena implementación de GTM; a continuación te muestro una breve explicación de como hacerlo:

1. Crear una variable en Tag Manager

Dentro de GTM vamos al menú «Variables», pulsamos en «Nueva» y creamos una de tipo «Constante», asignamos el nombre a la variable, por ejemplo «Id Analytics» y como valor de la variable ponemos el identificador de la propiedad que habremos creado previamente con Google Analytics, sin comillas, tal y como se indica en la imagen. Pulsamos en «Crear variable» y la guardamos.

2. Crear un activador

Aquí debemos pensar si queremos que nuestro código se active en un momento determinado de la navegación, en cuyo caso debemos seguir la explicación que vendrá a continuación; o si por el contrario el código se activara siempre y en todas las páginas, para lo cual no sería necesaria la realización de este paso.

Si por ejemplo queremos que nuestra web cumpla con la Ley de Cookies, el código sólo se debería activar cuando el usuario acepta la política de cookies, es decir cuando continúa navegando por la página durante más de 30 segundos o bien cuando las acepta mediante un click.

En este caso, crearemos un activador que se basa en el evento “ACEPTACOOKIES” que se dispara cuando sucede cualquiera de las dos acciones citadas anteriormente. En el sitio web habrá que programar algo que cuando se produzca la aceptación de las cookies, genere un evento que GTM pueda reconocer.

 Esto se haría añadiendo una línea de código JavaScript dentro de la función que controla la aceptación de las cookie en nuestra web/app.

dataLayer.push({‘event’: ‘eventoAceptaCookies’});

Con esta instrucción, generamos un evento con nombre “eventoAceptaCookies”. A continuación vamos dentro de GTM, al menú «Eventos» y creamos uno de tipo «Evento personalizado». Le asignamos un nombre para identificarlo dentro de GTM e indicamos dentro de Activar, el nombre que le hemos dado en el código fuente, como valor de la variable evento en el dataLayer.push mencionado anteriormente.

3. Crear una etiqueta en Google Analytics y asociarla al activador

Ahora debemos crear una etiqueta de seguimiento de Google Analytics. Vamos al menú «Etiquetas» y creamos una nueva. Seleccionamos como producto Google Analytics, tipo de etiqueta «Universal Analytics» y en configurar etiqueta ponemos:

ID de seguimiento–> {{Id Analytics}}  –> Id Analytics es el nombre de la variable creada en 1, pero se pone entre {{ }} para indicar que es una variable.

En tipo de seguimiento marcamos «Página vista», ya que lo que vamos a realizar es el seguimiento básico de página. Cualquier otra opción adicional como dimensiones personalizadas, seguimiento multidominio, … se configura desde las opciones avanzadas.

A continuación en «Activar», si no hemos creado el activador, seleccionamos la opción «Todas las páginas», de forma que el código se cargue en todas las URL del sitio. Si hemos creado el activador “Evento acepta cookies” pulsamos en «Más» y después, seleccionamos el activador personalizado que habíamos creado. Por último pulsamos en «Crear etiqueta».

4. Vista Previa

Antes de implementar cualquier cambio en GTM es recomendable probarlo. Para ello, pulsamos en la zona superior derecha en «Vista previa» y refrescamos nuestro sitio web. Se abrirá en modo «Pruebas» y podremos ver si se activa la etiqueta o no. En caso de activarse, también podemos comprobar de forma simultánea en el informe de tiempo real de Google Analytics si la visita se produce.

5. Publicamos los cambios

Una vez hemos verificado que todo funciona, pulsamos sobre un enlace en la zona superior «Salir del modo vista previa» y pulsamos en «Publicar». Ya tenemos implementado el seguimiento con Google Analytics mediante Tag Manager.

Si te ha gustado el artículo te animo a que leas algún otro de mi blog.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *