Aprende Google Tag Manager con este tutorial manual
MARKETING / SEO

Tutorial Google Tag Manager: Guía completa para instalarlo y aprender 

En este tutorial de Google Tag Manager 2019 te explicaré paso a paso como aprender a usar la herramienta, cómo instalar su código en tu web y como comprobar si lo has hecho correctamente. Esta es la guía más completa para que entiendas cómo funciona y puedas aprender GTM para principiantes.

Aprende Google Tag Manager con este tutorial manual
Tutorial paso a paso de Google Tag Manager, tu mejor guía

 

Google Tag Manager es un sistema de gestión de etiquetas (en inglés llamado TMS). Para que me entiendas, te diré que cada etiqueta es un trocito de código que antes debías colocar en las entrañas de tu web mientras que ahora, con Google Tag Manager, lo añades cómodamente a esta fantástica herramienta.

GTM gestiona el etiquetado de tus campañas de marketing así como de eventos y funciones avanzadas independientes. En este tutorial para aprender a usar Google Tag Manager te cuento:

  • Por qué empezar a usar Google Tag Manager
  • Definición de conceptos
  • Como introducir el código en tu web
  • Cómo comprobar si has instalado correctamente Google Tag Manager

 

TUTORIAL DE GOOGLE TAG MANAGER

Si eres experto en código y puedes hacer y deshacer a tu antojo en el corazón de tu web, Google Tag Manager te aportará organización y centralización de todas tus etiquetas pero es que, si no sabes de código, ¡te salvará la vida!

Con Google Tag Manager tendrás todos esos pequeños trocitos de código llamados etiquetas agrupados en un solo lugar y con una estética que dista mucho del lenguaje difícilmente descifrable del código puro informático.

Además, como esta es una herramienta de Google, al buscador le encanta que uses GTM porque favorece la velocidad de carga de tu web. En vez de cargarse los fragmentos de código poco a poco, se cargan de una sola vez al cargar Google Tag Manager.

Siendo una herramienta gratis y  bastante intuitiva a la hora de usarla, nos da datos precisos y nos permite hacer seguimiento de eventos y clics con opciones avanzadas que no podemos tener en Google Analytics ni Google AdWords.

 

DEFINICIÓN DE CONCEPTOS DE GOOGLE TAG MANAGER

Si bien en Google Analytics la jerarquía de la herramienta consta de Cuenta / Propiedad / Vista en Google Tag Manager los elementos a tener en cuenta son: Etiquetas / Activadores /Variables.

Google Tag Manager funciona con proyectos. En este tutorial quiero hacer hincapié en los conceptos porqué son indispensables para comprender bien cómo funciona el programa.

Los proyectos contienen contenedores. Para que me entiendas, un proyecto puede ser un cliente y ese cliente (proyecto) puede tener varias webs (contenedores). En un caso así crearías un proyecto que tendría en su interior tantos contenedores como webs tuviese el cliente.

Etiqueta: Como ya te he comentado, la etiqueta es un fragmento de código HTML o JavaScript que sirve para etiquetar nuestro sitio.

Activador: Es una condición o regla necesaria para que esa etiqueta empiece a funcionar. Por ejemplo, una vista a la página de confirmación de compra o un click en un botón determinado. Cuando esa acción sucede, el ‘Activador’ activa la etiqueta que previamente has creado.

Variable: Las variables son elementos que pueden afectar tanto a las etiquetas como a los acrtivadores. Son datos dinámicos que extraemos del sitio web y enriquecen todavía más las funciones de Google Tag Manager. 

Simplificando: Las etiquetas se activan según unas reglas (activadores) y esas reglas son cambiantes (variables).

 

Te interesa: 15 Trucos SEO para Instagram, Facebook y Twitter

 

CÓMO PONER EL CÓDIGO DE GOOGLE TAG MANAGER EN MI WEB 

Iremos paso a paso porqué es fácil perderse durante el proceso de creación.

1- Crea el contenedor de tipo Sitio Web

Entramos a tagmanager.google.com y arriba a la derecha le das a “CREAR CUENTA”.

Ante ti se abre esta página que te pide que le des un nombre a esa cuenta y que la sitúes en tu país. Rellena los datos y haz clic en ‘continuar’. 

 

En GTM creas cuenta con contenedores.
Tutorial para crear una cuenta en google tag manager.

 

Acto seguido te pide que configures el contenedor. Debes escribir la URL de tu web (recuerda especificar si va con http o con https) y debes seleccionar “Sitio Web” donde pone ‘Dónde Utilizar el Contenedor’. Haz clic en ‘Crear

 

Contenedor sitio web en GTM
Tutorial para crear contenedor en Google Tag Manager de tipo sitio web

 

Tras aceptar las condiciones legales que Google te presenta, se abrirá ante ti una pantalla con el código de Google Tag Manager que debes introducir en tu web. Como ves, el código va en dos partes. La parte más larga, la primera, tiene que ir dentro de la etiqueta  <Head>, es decir, en el Header de tu web. 

La parte de código que falta, tiene que ir colocada después de la apertura de la etiqueta <body> de tu sitio web.

 

google tag manager va con código en tu página web
Tutorial para insertar el código de GTM en tu web.

 

Hay varias maneras de introducir el código de Google Tag Manager en tu web, lo puedes hacer -si tienes WordPress- desde Apariencia/Editor y buscas luego el header y el body. También lo puedes hacer modificando el archivo desde el servidor o, simplemente, usando un plugin.

Yo te recomiendo pegarlo en el header y el body de tu web de manera manual, es una sola vez y ya lo tienes para siempre, además, es sencillo.

Tu header debe quedar así una vez añadas la etiqueta de código de Google Tag Manager. Yo la tengo puesta antes del cierre de Head y justo después del inicio de body.

Mete el código de GTM en tu web con este tutorial
Insertar el código de Google Tag Manager en tu web.

 

Si durante el proceso perdieras de vista tu código de Google Tag Manager no pasa absolutamente nada. Lo puedes recuperar de manera sencilla y manual yendo al inicio de todo, entrando en Google Tag Manager y haciendo clic en la ruedecita de herramientas correspondiente a la cuenta que acabas de crear.

 

Dónde encontrar el código de Google Tag Manager si lo has perdido
Tutorial para encontrar el código de GTM si lo pierdes

 

Se te abrirá la configuración de tu cuenta y sólo tienes que hacer clic en la opción ‘Instalar Google Tag Manager’ para que la pantalla con tu código se te vuelve a abrir y puedas copiarlo y pegarlo en tu sitio web.

 

El código web de GTM está en la opción de Instalar.
En la opción de Instalar Google Tag Manager está el código.

 

Una vez tienes el código pegado en tu web, ya puedes empezar a crear etiquetas con activadores y variables. Recuerda que si quieres fusionar Google Tag Manager y Google Analytics, deberás borrar el código de Analytics que tenías previamente en tu web para no duplicar información y generar errores. Lo mismo pasa con el Píxel de Facebook u otras aplicaciones que ahora podrás agrupar cómodamente en Google Tag Manager. Te enseñaré a hacerlo todo en mi próximo post, si no te lo quieres perder, te lo puedo enviar por email, entra y no te lo perderás.

 

CÓMO SABER SI HE INSTALADO BIEN GOOGLE TAG MANAGER

Una vez hayas insertado el código de Google Tag Manager en el interior de tu web y lo hayas guardado, tienes que ir a Chrome y agregar la extensión Google Tag Assistant. Esta extensión del navegador reconoce todas las etiquetas de Google que tienes instaladas en cualquier web y, por lo tanto, te dirá si tienes o no instalado GTM.

Cuando ya tengas la extensión de Chrome instalada, ve a tu web tecleando la URL y activa Google Tag Assistant. Si te aparece la etiqueta de Tag Manager como te muestro en la fotografía, ¡lo tienes todo bien hecho y listo para funcionar! 

 

Google Tag Assistant me dice si tengo instalado Google tag Manager
Saber si tengo bien instalado el código de Google Tag Manager con Google Tag Assistant

 

Esta herramienta es relativamente nueva y, sobre todo, novedosa. Aunque al inicio puede parecer compleja de usar, con la práctica te darás cuenta de lo útil y eficaz que es y podrás decir adiós a ese código que, de no saber insertarlo, tantos dolores de cabeza te da. En las próximas semanas te contaré cómo instalar Google Analytics, el Píxel de FB y crear varias etiquetas muy útiles para los botones, el scroll y el tráfico de tu web. Recuerda suscribirte si prefieres que te llegue directamente al correo electrónico.

Si te ha sido útil este post dale  ⭐️⭐️⭐️⭐️⭐️  por favor. Cualquier duda que te surja durante el proceso, ¡escríbemela en comentarios y te ayudaré! Y tú, ¿estás preparado para usar Google Tag Manager?

4 comentarios sobre “Tutorial Google Tag Manager: Guía completa para instalarlo y aprender ”

  1. Hola! mil gracias me ayudaste mucho, entendí todo a la perfección solo que ahora tengo la duda ¿como agregar eventos del pixel de fb a mi sitio con GTM?

    1. Es exactamente igual, creas una nueva etiqueta y en vez de introducir el html personalizado del pixel, pones el del evento que hayas creado en FB, también las variables como id de producto, nombre etc. También puedes crear etiquetas para «añadido al carrito o purchase etc.) Más adelante prepararé un post avanzado sobre esto, pero habiendo instalado el pixel, es el mismo procedimiento Vicente, ¡un saludo!

  2. Para instalar el píxel de Facebook a través de Google Tag Manager tengo que tener configurado Tag Manager en la web, ¿no?

Deja un comentario

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

Acepto la política de privacidad: Responsable: Anna Kubrick (Anna Sánchez) Finalidad principal: Envío de mis artículos del blog. Legitimación: Consentimiento del interesado. Destinatarios: No se cederán datos a terceros, salvo autorización expresa u obligación legal. Hosting de Webempresa. Derechos: Acceder, rectificar y suprimir los datos, portabilidad de los datos, limitación u oposición a su tratamiento, transparencia y derecho a no ser objeto de decisiones automatizadas. Puedes escribir a hola@annakubrickcontent.com  Info adicional: Puede consultar la información adicional y detallada sobre nuestra Política de Privacidad y Aviso Legal. *