Cómo instalar Analytics con Google Tag Manager

La analítica web es fundamental para ver las visitas que recibes en tu blog, controlar que se estén cumpliendo los objetivos que has planteado para tu negocio online, etc…. Para poder analizar una web, Google nos facilita su herramienta Google Analytics. Ésta, tiene una versión gratuita y una de pago, pero la mayoría de las veces con la versión gratuita es más que suficiente.

Normalmente el código de Google Analytics se implementa en WordPress mediante código o a través de un plugin, aunque ya sabéis que cuantos menos plugins usemos, mejor. Por eso quiero explicaros cómo podéis instalar el código de Google Analytics con Google Tag Manager.

Eso sí, si necesitas saber como instalar Google Tag Manager en tu web, aquí te dejo el post donde lo explico.

¿Por qué implementar el código de Google Analytics con Tag Manager?

La verdad es que da menos trabajo instalar el código de Google Analytics a mano o con un plugin, pero la verdad es que tiene una ventaja enorme ya que si cambias de tema no tendrás que andar incrustando los códigos de seguimiento de cada herramienta, sino que basta con que metas el código de Tag Manager y tendrás todas las herramientas que hayas metido desde él instalados en tu nuevo tema.

Además, Google recomienda su uso para instalar todos los códigos de seguimiento de sus herramientas. Es decir, no solo recomienda implementar Analytics a través de Tag Manager, sino que también recomienda implementar el código de AdWords, Optimize (herramienta que ha lanzado recientemente para hacer teses A/B entre otros en los sitios web aún en estado Beta), etc….

Pasos para instalar Google Analytics con Google Tag Manager

Actualmente existen dos versiones distintas de Google Analytics conviviendo a la vez, Universal Analytics o GA3 y GA4. Por lo que os voy a explicar cómo podéis instalar cualquiera de las dos versiones.

Instalar Universal Analytics con Google Tag Manager

1º Crear una variable con Tag Manager

En la pestaña Área de trabajo o Workspace de Tag Manager, clicamos en variables, pinchamos en Variable type y seleccionamos la opción Configuración de Google Analytics que aparece en la parte de utilidades en la ventana que aparece a la derecha.

Hecho esto, nos permitirá introducir la ID de seguimiento de Analytics. Es decir, el código de seguimiento UA-XXXXXXXX-X. Además, es recomendable nombrar la nueva variable que hemos creado. En mi caso la he llamado Analytics, pero la puedes llamar como quieras.

También se puede instalar el código sin necesidad de crear una variable. Sin embargo, es muy recomendable crear dicha variable porque si más adelante tenemos que cambiar el código de seguimiento, cambiándolo desde la variable lo cambiaremos en todas las etiquetas en la que lo hayamos usado.

2º Crear una etiqueta de Universal Analytics con Tag Manager

Esta vez en lugar de seleccionar la opción variables, seleccionaremos la pestaña de etiquetas.

Una vez que selecciones la opción etiquetas, aparecerá una ventana con las opciones configuración de la etiqueta y activación.

Tal y como hemos hecho en las variables, también podemos darle un nombre a la etiqueta. Es una práctica muy recomendable ya que así podrás diferenciarla del resto de etiquetas que crees. En mi caso le he llamado Universal Analytics.

Para crear la etiqueta, clicamos en configuración de la etiqueta y elegimos la opción Universal Analytics.

Ahora seleccionaremos la opción página vista en el tipo de seguimiento y elegimos la variable que hemos creado anteriormente pinchando en el desplegable de configuración de Google Analytics. En mi caso se llama Analytics y aparecerá entre “{{ }}” lo que indica que es una variable.

Posteriormente debemos seleccionar el activador. En este caso como no hemos creado ningún activador, seleccionamos All Pages o todas las páginas (dependerá del idioma con el que tengamos configurado Tag Manager) y le damos a guardar.

3º Previsualizar la implementación

Antes de darle al botón enviar, es recomendable probar si todo funciona correctamente. Para esto clicamos en el botón vista previa y abrimos nuestro sitio web. Se abrirá en modo “pruebas” y podremos ver si se activa la etiqueta o no.

4º Publicar los cambios

Una vez que hemos verificado que todo funciona perfectamente, clicamos en salir del modo vista previa y pulsamos en Enviar. Con esto ya tendremos instalado el código de seguimiento de Google Analytics con Google Tag Manager.

A pesar de haber realizado las pruebas en el modo vista previa no está de más volver a probar si funciona una vez publicado los cambios visitando nuestro sitio web y viendo si lee las visitas. También podemos saber si está bien implementado nuestro código mediante la extensión de Chrome llamada Tag Assistant.

Instalar GA4 con Google Tag Manager

Instalar GA4 con Google Tag Manager es algo más fácil ya que no tendremos que crear una variable. Salvo eso, y que el segundo paso cambia un poco el resto de pasos, es decir el 3º y 4º paso anterior serían exactamente iguales. Veamos cómo se crearía la etiqueta de GA4:

Crear una etiqueta de GA4 con Tag Manager

Para crear una etiqueta de GA4 con Google Tag Manager en vez de escoger Universal Analyltics, debemos elegir Configuración GA4. Tener cuidado porque existe una etiqueta de evento GA4 y en realidad en este momento estamos configurando Google Analytics, no un evento.

Ahora veamos la configuración de la etiqueta:

En este caso, tal y como hemos comentado antes, ya no tenemos que seleccionar la variable porque no hace falta crear una variable. Bastará con que metamos el ID de medición que nos da GA4 y listo. Seleccionamos que se active la etiqueta en todas las páginas y le damos un nombre a la etiqueta, como por ejemplo GA4.

Y ya estaría. Ahora hacemos los pasos 3 y 4 que hemos explicado ya en la instalación de Universal Analytics y listo.

Espero que este post te haya servido de ayuda para implementar el código de Analytics con Tag Manager. De todas formas si no consigues instalarlo o tienes dudas puedes ponerte en contacto conmigo a través de los comentarios del post o a través del formulario de contacto.