¿Cuánto pagarías por conocer exactamente qué hace un usuario cuando aterriza en tu página web? Por ejemplo saber qué enlaces visitó, dónde hizo click, cuántas descargas se hicieron de un determinado recurso, reproducciones de vídeos, viralización de un contenido y un largo etc. Tendrías el poder de saber qué le gusta al usuario y optimizarlo para maximizar las conversiones. Pues aunque no lo sepas, ese poder te está esperando desde hace mucho tiempo en Google Tag Manager.

guia google tag manager

Por eso, porque es probable que desconozcas esta herramienta, te presento esta guía, cortesía de Luis Revuelto, consultor SEO y de marketing online, para que empieces a utilizarla y aprovecharte de sus ventajas. Pero antes de entrar en materia quiero explicarte en qué consiste, asi que vamos paso a paso.

También te puede interesar:

Índice

Esta página esta continuamente actualizándose. Vuelve de vez en cuando.

Qué son las etiquetas o tags

manual google tag manager

Bien, con los tags (o etiquetas) nos referimos a un pedazo de código que colocamos sobre los elementos de la web para hacer seguimiento de la interacción del usuario con dichos elementos. Lo que ocurría hasta hace no mucho tiempo, es que la colocación indiscriminada de estos bloques de código, provocaba un rendimiento pobre de la página web, al usar código redundante o utilizarlo incorrectamente.

Con Google Tag Manager se acaban dichos problemas, porque sólo tenemos que insertar código una vez y nos podemos olvidar para el futuro, ya que haremos los cambios a través de una interfaz. Puedes preguntarte ¿cómo es posible? Muy sencillo, básicamente lo que hace es crear las funciones necesarias en su propio servidor y se realiza una llamada a estas funciones desde el bloque de código insertado. Veamos cómo utilizarlo…

Cómo instalar y configurar Google Tag Manager

#1 Instalar Google Tag Manager

tutorial google tag manager

Para instalar Google Tag Manager en tu sitio web, lo primero que debes hacer es registrarte en Tag Manager. Si tienes cuenta de Google, ya sabes Gmail, sólo tienes que pulsar el botón SIGN IN.

Pantalla Inicial

tutorial google tag manager añadir cuenta nueva

Una vez entras en la plataforma, tendrás que crear una nueva cuenta para obtener el código de Google Tag Manager, que es el llamado “Contenedor”. Se mostrará la siguiente pantalla, que puedes rellenar con el nombre de tu proyecto (en ambas casillas).

Contenedor

En este caso, te voy a mostrar cómo hacer seguimiento de un sitio web, pero también se puede utilizar para rastrear el comportamiento en una aplicación de Android o iOS. Haces click en el botón “Crear” y te mostrará el acuerdo legal que aceptamos siempre que usamos una aplicación. Al aceptarlo se muestra una nueva pantalla con el código de inserción como puedes ver a continuación:

Código Google Tag Manager

tutorial gratis google tag manager contenedor

Este será el único, repito, el único código que tendrás que insertar en tu web. Simplemente copia lo que viene en el recuadro y pégalo en el código HTML de tu sitio. Teóricamente debe ser justo después de la etiqueta <body>, pero yo os recomiendo hacerlo dentro de <footer>.

#2 Configurar el contenedor de etiquetas

El siguiente paso es configurar las etiquetas que utilizarás dentro de tu contenedor. Los elementos más importante que debes conocer son las etiquetas, los activadores y las variables. Vamos a ver uno por uno.

Etiquetas

tutorial google tag manager etiquetas

Las etiquetas son los bloques que código que hacen el trabajo de medición de la interacción del usuario. Una gran ventaja es que la sintaxis de estos está predefinida en plantillas de etiquetas para las diferentes herramientas de medición de que existen (Google Analytics, CrazyEgg, ClicTale…).

Esto permite que tú solo tengas que decirle qué es lo que quieres medir. Desde una página vista (lo que seguramente ya estás haciendo si utilizas Google Analytics), hasta transacciones, tiempos, interacciones sociales o eventos, como puede ser la reproducción de un recurso.

Variables

tutorial google tag manager variables

Las variables o macros sirven para almacenar los valores que recogeras de la interacción del usuario con tu sitio web. Google Tag Manager nos presenta variables ya predefinidas que recogen datos como por ejemplo la URL de la página sobre la que actúa el usuario, el elemento sobre el que hace clic, valores de un formulario…etc.

Activadores

tutorial google tag manager activadores

Los activadores o reglas sirven para manejar lo que ocurre en el sitio web, decidiendo cuándo se debe ejecutar el código que recoge los datos de los que te hablaba anteriormente. Es decir, qué acción es la que desencadena la medición. Por ejemplo, cuándo el usuario hace clic sobre un determinado enlace.

Valora el contenido por favor

 

>Caso Práctico: Seguimiento de clics externos

tutorial gratis google tag manager

Vamos a ver un caso práctico, que es la mejor manera de aprender el funcionamiento de una herramienta.  Tengo un blog de recetas y quiero comprobar los clics que recibe un banner colocado en mi web, fundamental para pasarle la factura al anunciante (X clics multiplicado por el precio acordado)  a final de mes. El anunciante en este caso sería el agregador de recetas buscador-de-recetas.com.

Puedo controlar todo lo que ocurre a lo largo y ancho de las páginas que componen el blog, pero cuando el usuario sale de mi página, le pierdo la pista. Sin embargo, con Tag Manager puedo saber sobre qué enlace hizo clic el usuario. Para ello, yo empezaría por crear una etiqueta (para mi gusto es más fácil aclararse). Con la etiqueta le diré que quiero un bloque de código que realice el seguimiento de un suceso en la web (Ej. se ha visto una página, se ha hecho una transacción, ha ocurrido un evento como en será en este caso). Los datos que tengo que rellenar en la etiqueta serían los siguientes:

  • El ID de seguimiento de Google Analytics (lo podemos recoger previamente en una variable)
  • Tipo de seguimiento (en este caso Evento)
  • Categoría (clasificación para aclararnos en Google Analytics, pondremos Banners)
  • Acción (la recogemos con una variable)
  • Etiqueta (una subcategoría, en este caso podemos darle el nombre de la marca a la que corresponde el banner)

tutorial google tag manager etiqueta buscador de recetas

Buscador de recetas

Etiqueta Buscador de Recetas

  • Ojo, en la Configurar Etiqueta le puedes dar una prioridad para asegurarte de que no interfiere con otras etiquetas (en este caso no será necesario).
  • En el siguiente paso, “Activar”, te dirá que necesita un activador, que puede ser el simple clic o algo más específico. Como en nuestro caso, un clic en un banner determinado.

De aquí te puedes ir directamente a la pantalla de Activadores para crear un activador, que vamos a ver a continuación.

tutorial google tag manager activador buscador de recetas

Activador para el buscador de recetas

  • Selección del tipo de evento: “Clic”
  • Configurar activador: “Solo enlaces”
  • Habilitar cuando, es decir, ¿cuál es el detonante de que empiece a medir? En este caso que esté en una URL determinada, concretamente en la Home.
  • Activar, es decir, las condiciones particulares de esta etiqueta. En este caso, sólo cuando la URL sobre la que se está haciendo clic (Clic URL) sea la que estamos buscando. En mi caso basta con poner solo que contiene el nombre de dominio, ya que sólo tengo un banner que enlaza hacia buscador-de-recetas.com
  • Guardamos el activador

El siguiente paso es volcar estos datos al contenedor, para lo cual tenemos el botón Publicar en la parte superior derecha. Pero alto, antes de publicar, te recomiendo que compruebes que lo que acabas de implementar funciona. ¿Cómo? Google Tag Manager ofrece un botón de vista previa y depuración.

tutorial google tag manager depurar

Para ello, tenemos que tener abierta una pestaña en el navegador, con la web sobre la que estamos trabajando. Al pulsar Vista Previa, se nos cargará un apartado de depuración en el navegador (similar a las herramientas para desarrolladores). Ahí nos irá indicando las Etiquetas que se van ejecutando con la interacción en la página. Por ejemplo, veamos qué ocurre si hago clic en el banner que estoy realizando seguimiento,

tutorial google tag manager depurar

Fíjate en los recuadros que te he marcado. Cuando he hecho clic en el banner de Buscador de recetas, se ha disparado la Etiqueta Buscador de recetas (además de otras dos que tengo yo puestas en esta página). Y como puedes ver en el resumen de la izquierda, recoge los datos relacionados con este clic (clic y enlace). Así que funciona perfectamente, ya puedes iríamos a Publicar. No te olvides de Publicar cuando estés seguro de que está correctamente implementado. Por si acaso, te va avisando de los cambios no publicados todo el tiempo.

Ahora pasamos a comprobarlo en Google Analytics. Antes tenías que esperar un par de días a ver los resultados de tus cambios en esta herramienta de analítica web. Lo bueno es que ahora puedes verlos en tiempo real. Así que me voy a Tiempo Real> Eventos y puedo ver los resultados de esta implementación en GTM.

Comprobación Eventos en Google Analytics

tutorial google tag manager comprobacion google analytics

Como puedes ver, muestra que ha habido una interacción con el Banner, donde la URL sobre la que se ha hecho clic es efectivamente buscador-de-recetas.com. Por tanto vemos que funciona y ya podemos empezar a medir la cantidad de clics que tiene nuestro banner.

Conclusión

¿Qué te ha parecido? Por mi parte reconozco que a priori, con la escasa documentación en castellano, es difícil empezar, pero si tienes los pasos ves que es muy fácil. Esta herramienta aún tiene mucho por mejorar en cuanto al soporte, pero si utilizas la opción de Feedback, puedes incluso darles pistas de tus problema con una curiosa modalidad de capturas que te ofrecen para reportar los fallos.

Valora el contenido por favor

 

A otros usuarios les intereso…