Google Tag Manager: qué es y cómo usarlo

12/10/2017
  • Introducción a Google Tag Manager, una herramienta gratuita de Google que, en cuanto la conozcas, no podrás vivir sin ella. ¡Descúbrela!

  • Google nos ofrece algunas soluciones gratuitas para todos aquellos que queremos ver qué sucede en nuestros negocios. Con pocos conocimientos y algo de dedicación mínima, podemos tener instaladas herramientas de analítica web tales como Google Analytics y Search Console (antiguo Webmaster Tools).

    La dificultad llega cuando no somos programadores y necesitamos dar un paso más a la hora de implementar códigos de seguimiento. O queremos tenerlo todo más estructurado y que sea más fácil de gestionar sin tener que ensuciar el código o tener que molestar al equipo de programación.

    De esta necesidad nace Google Tag Manager, un sistema gratuito que nos permite realizar acciones avanzadas de analítica web e instalación de códigos sin necesidad de estar tocando el código ni tener muchos conocimientos sobre este.
  • Qué es Google Tag Manager

  • Google Tag Manager es un sistema de etiquetado que permite actualizar de forma más fácil y rápida las etiquetas de seguimiento, así como fragmentos de código de sitios webs y aplicaciones móviles.

    Entre sus grandes ventajas resalta el no tener que depender de un desarrollador (en gran medida) cada vez que se requiere implementar o modificar algún elemento de analítica.

    Otra de las ventajas que podemos encontrar es el poder gestionar todo desde un panel de control, que puede resultar un poco complejo al principio, pero tras probar algunas cosas, se hará todo mucho más fácil y llevadero.

    Todos los cambios realizados en Google Tag Manager se guardan en versiones, por lo que, si se realiza un cambio erróneo, siempre existe la opción de volver atrás y restaurar la versión anterior. Además, cuenta con una opción de Vista Previa, para ver si realmente funciona la implementación realizada a través de Google Tag Manager.

    Por último, en la red existen bastantes recursos que podemos encontrar con una búsqueda rápida. Son guías y códigos ya probados y programados, por lo que no necesitarás entender mucho, excepto seguir los pasos indicados.
  • Partes principales de Google Tag Manager

  • Una vez creada la cuenta de Google Tag Manager, accederemos a unos paneles con las cuentas asociadas a cada dominio o aplicación móvil.
  • Dentro de la cuenta, nos encontraremos con las vista por defecto Overview, que es la primera opción del menú de la izquierda (la sección marcada con el número 1 en la imagen). A continuación, en este menú encontramos las secciones de:

    • Tag
    • Triggers
    • Variables
    • Folders

    Aunque suene todo a chino, cada una de estas secciones tiene una funcionalidad:

    • Tags: es la etiqueta a ejecutar dentro de la web. Esta etiqueta de normal será un código de seguimiento que nos dé algún programa y nos diga que tenemos que insertarlo dentro de la web, o algún fragmento de código que necesitamos ejecutar tras una acción. Para crear una etiqueta, es obligatorio usar un “trigger, mientras que las “variables” no son obligatorias, pero sí tienen una gran dependencia de estas para explotar todo su potencial.
    • Triggers: es el detonante que hará que nuestra etiqueta se ejecute o no. Puede ser tanto inclusivo como exclusivo. Por ejemplo, con los “triggers” podemos decir que la etiqueta se ejecute en todas las páginas, a excepción de la página de contacto. Pueden tener diferentes tipos de combinaciones, desde URLs hasta clicar elementos dentro de la web.
    • Variables: son contenedores en los que almacenar la información que usemos repetidas veces. También podemos enviar información dinámica a estas variables, para luego enviarla a programas de seguimiento, etc.
    • Folders: carpetas en las que ordenar toda la información que vamos creando, de forma distinta a la clasificación por defecto que tenemos de Tags, Triggers y Variables.

    En la parte superior derecha (marcado con un 2), tenemos el modo “Preview”, que podemos usar para comprobar que nuestra etiqueta implementada funciona correctamente.

    También tenemos el botón “Submit”, que nos permite guardar la información y crear una versión de esta, dándole un nombre y una descripción algo más extensa, para poder identificar cada versión y restaurarla en caso de que fuera necesario.
  • Implementación básica de Google Tag Manager y Analytics

  • Ya hemos visto de forma básica y genérica la plataforma de Google Tag Manager. Ahora estamos preparados para realizar una fácil y pequeña implementación junto con Google Analytics.
  • Implementación de Google Tag Manager

  • Para empezar, accedemos a la cuenta principal de Google Tag Manager y, si no tenemos cuenta, pulsamos el botón de “Create Account” arriba a la izquierda.
  • Tras pulsar en el enlace, veremos un panel en el que nos pedirá que le demos un nombre a la cuenta. Este nombre de cuenta solo se usa para que nosotros, como usuarios, podamos identificar que la cuenta pertenece a una determinada web o aplicación móvil.

    Tenemos la opción de compartir la información con Google de forma anónima. Esto les ayuda a realizar informes y estudios para mejorar la información que tienen y generar informes, así como mejorar los anuncios. No es obligatorio y depende de la privacidad que queramos tener con nuestros datos, aunque lo dicho, toda la información se comparte de forma anónima.
  • Después de rellenar la información y pulsar a siguiente, sí que deberemos introducir nuestra web.
  • Luego le daremos al botón de “Create” y aceptaremos las condiciones legales (si no las aceptas, no puedes crear la cuenta, es obligatorio). Tras aceptar, nos llevará a una ventana con un pop-up, donde nos mostrará el código a implementar y nos dirá exactamente dónde debemos implementarlo.
  • TIP PRO: Si usamos alguna plataforma web que acepte instalación de plugins o módulos desde un panel de administración, puede que, en vez de instalar este código, únicamente necesites indicarle tu ID de Google Tag Manager, que aparecerá en la vista de tu “Overview”, justo al lado de los botones de “Preview” y “Submit” en la parte superior derecha de la pantalla. El ID de una cuenta de Tag Manager se ve tal que así: GTM-XXXXX.

  • Implementación de Analytics

  • Una vez instalada y creada la cuenta de Google Tag Manager, podemos agregar nuestro primer código de seguimiento con Google Analytics.

    Lo que vamos a realizar es crear una variable donde almacenar el UA de Analytics, que es el identificador de cuenta de Analytics, para más tarde agregarlo a nuestro “Tag”, que realizará un seguimiento del usuario con el código de seguimiento de Google Analytics.

    Para ello, debemos irnos a la opción de “Variables” en el menú de la izquierda, y pulsar en “New”.
  • Se abrirá un pop-up, donde podremos dar nombre a la variable (para este ejemplo, recomiendo darle el nombre de “UA-Analytics”). Si pulsamos arriba a la izquierda, podemos asignar un nombre a la variable y si pulsamos en el recuadro de en medio blanco de la ventana, podremos asignar el tipo de variable.
  • A la hora de seleccionar variables, en este caso buscaremos la opción de “Constante”. Si bien es cierto que actualmente contamos con una variable para la cuenta de Analytics, para este ejemplo usaremos la variable constante que es como se instalaba antiguamente, ya que el objetivo de esto es tener una pequeña noción de cómo funcionan las variables.
  • Para terminar nuestra variable, solo nos queda introducir nuestro UA-XXXXXXX-Y de Analytics y guardar la variable.

    Ahora debemos ir a la sección de “Tags”, pulsamos en “New”, le damos un nombre a la etiqueta de la misma forma que se lo dimos a la variable, y luego pulsamos sobre el recuadro de “Tag Configuration” para indicar el tipo de etiqueta que queremos añadir. En este caso, seleccionaremos la opción de “Universal Analytics”.
  • Una vez ya hemos seleccionado el tipo de etiqueta que queremos agregar, indicaremos que el “Tipo de seguimiento” es de “Página vista”, habilitaremos el checkbox que dice “Habilitar la anulación de configuración de esta etiqueta”, y donde pone “ID de seguimiento”, agregaremos la variable que hemos creado pulsando el icono que contiene la pequeña ficha que parece un bloque de Lego.

    Con esto le estamos indicando a Tag Manager que queremos ejecutar el código de seguimiento de Google Analytics en todas las páginas, y la cuenta de Analytics que queremos usar.
  • Si seguimos un poco más abajo, después de completar estos campos, veremos la opción de lanzar la etiqueta llamada “Triggering”. Desde aquí seleccionaremos un trigger que viene creado por defecto, llamado “All Pages”. Esto hace que la etiqueta se ejecute en todas las páginas.
  • Ahora ya solo nos queda guardar la etiqueta, y antes de publicar los cambios es necesario realizar un test de que todo funciona correctamente con el modo “Preview”.

    Al pulsar el botón y acceder a nuestra web desde una nueva pestaña, observaremos un bloque en la parte inferior de la pantalla. Esto nos indicará si el código se ha ejecutado o no (aunque la información aparecerá en inglés).

    Tras comprobar si todo funciona correctamente, o falla algo y necesita ser corregido, publicaremos los cambios dando un título a la versión y una descripción con los cambios o implementaciones realizadas.

    Con todo esto, ya tendremos el código de Google Tag Manager implementado y el tracking básico de Google Analytics también, por lo que podremos ver información básica de los usuarios que llegan a nuestra web.

    Además, con Google Tag Manager, una vez instalado también será mucho más fácil instalar otras cosas como eventos de Analytics, seguimiento de Google Adwords, otros códigos de seguimiento, etc.

    Ahora que ya tienes todo instalado y configurado, si quieres aprender algo sobre Analytics, puedes continuar leyendo el artículo de Oleoshop sobre las métricas básicas.
  • ¿Te ha resultado útil este tutorial para implementar Google Tag Manager? En los próximos días, te explicaremos cómo implementarlo en Oleoshop. Si te queda alguna duda, pregúntanos en los comentarios. ¡Estaremos encantados de ayudarte!

  • Imágenes | Google Tag Manager, Fotolia.

Eric Seguí


SEO y analista web con formación de programador. Actualmente trabajo en AgenciaSEO.eu, una agencia de marketing especializada en posicionamiento web. Si quieres saber más de mí, puedes ver más información en mi cuenta de Linkedin y Twitter.
comments powered by Disqus

Buscar entradas

Últimas entradas

Utilizamos cookies propias y de terceros para realizar la medición de nuestra web. Al continuar con la navegación entendemos que se acepta nuestra política de cookies

Acepto