Tutorial para aprender a emplearlo Google Tag Mánager desde cero
Con Google Tag Mánager podrás decir adiós a meterte en cada una de las webs a instalar el script de turno. Se acabó perder horas configurando eventos uno a uno, proyecto por proyecto.
Espera, que eso no es todo…
¿Y si además pudieses sacarle más partido a Google Analytics y recopilar datos de tus usuarios que parecían imposibles de saber? Pues si te gustan los datos, Analytics se te queda corto y quieres que no se te escape nada de lo que sucede en tu web, ésta es tu herramienta.
Ya sabes lo que afirman, el tiempo es oro, y el valor de los datos también. De ahí que debes empezar a usar Google Tag Mánager desde ahora mismo.
En este artículo aprenderás a configurar Tag Manager desde cero, step by step. Además, vamos a ver a configurar algunas de las implementaciones básicas a fin de que seas capaz de configurar el código de Analytics o medir el scroll de los usuarios de tu web.
¡Empezamos!
¿Que me marcho a hallar en este artículo?
Qué es Google Tag Mánager y para qué sirve
Google Tag Mánager es un gestor de etiquetas, creada con el propósito de hacerte la vida más fácil a la hora de administrar la analítica de tu web/app.
Es una de lasque nos ofrece dentro de su suitejunto a Analytics, Data Studio, Optimize, Surveys, Display y Search Ads. Nos permite medir datos utilizando pixels de Google (Analytics, Ads…) o bien herramientas externas como Facebook, Hotjar… etc.
Podemos utilizarla gratuitamente, aunque si te sobra el dinero por sólo 150 mil dólares anuales puedes tener la versión de pago, la suite 360.
Ventajas y desventajas de usarlo
Todo en esta vida tiene inconvenientes y ventajas, mas
en el caso de Tag Mánager, los pros superan con creces a las desventajasque pueda tener, veamos:
Principales ventajas:
1. Rapidez para implementar nuevas configuraciones o bien editar cambios
Situación frecuente en cualquier empresa mediana (de las grandes ni charlemos). El departamento de marketing quiere saber si los usuarios hacen o bien no hacen scroll y en qué porcentaje.
Para ello hablan con el jefe de Sistemas, quien accede y pone a la cola de todas y cada una de las tareas pendientes la implementación del seguimiento de scroll de los usuarios.
Antes de publicarse, por precaución, se publica la configuración en la versión de testing. Al ver que todo está ok, un mes o bien un par de meses después de solicitarlo el equipo de marketing ya tiene lo que quería.
Esto es lo habitual y como puedes comprender, ante cualquier cambio, las cosas tardan muuuucho en ejecutarse.
Con Google Tag Mánager el proceso es más rápido puesto que sólo necesitarán al equipo de Sistemas para la instalación, a partir de ahí cualquier cambio podrán ejecutarlo mismos.
En el caso de un proyecto personal donde la tónica es hacer las cosas a lo
Juan Palomo, la ventaja radica en no tener que hacer desarrollos a la medida o tener que añadir líneas de código en lugares específicos teniendo que abrir para ello decenas y decenas de archivos.
2. Todas y cada una de las tags gestionadas desde el mismo sitio
Esta es una enorme ventaja ya que algunosno se introducen en todas y cada una de las páginas.
Un ejemplo sería el píxel de conversión de Google Ads el cuál sólo queremos que se active en el momento en que un usuario llega a la
thank you page.
Si no usamos Tag Manager podemos tener unas tags en el header.php, otras en el footer.php, otras en una página gracias para el formulario, otras en el blog que es un subdominio que usa un Content Management System distinto… la dispersión y el follón puede ser notable si el proyecto tiene cierta extensión. Con GTM ganamos en productividad teniendo todo en el mismo sitio.
3. Configuraciones reutilizables
Para aquellos que trabajan en agencias o tienen varios proyectos, esto es una enorme ventaja. Puedes importar/exportar configuraciones de una cuenta de Tag Manager a otra, de un proyecto a otro, lo que facilita las cosas enormemente.
Configuramos una vez y replicamos en otras webs.
4. Controlador de versiones
Una de las mejores características que tiene Tag Mánager es su controlador de versiones.
Si trabajáis en equipo es fácil que la información a veces se pierda y uno no sepa lo que se ha hecho o bien dejado de hacer. En el supervisor de versiones podemos anotar toda vez que publicamos un cambio una descripción de lo que hemos hecho. Algo realmente útil para el que venga después.
Además, si nos equivocamos, ¡que no cunda el pánico! Podemos restituir ciertas versiones precedentes que funcionaban adecuadamente.
5. Modo testing para examinar el adecuado funcionamiento
Normalmente cuando utilizas Analytics y deseas revisar que está registrando datos apropiadamente te diriges a la opción
real time.
Primero haces la configuración (puedes tardar 1 minuto o 1 hora) y después chequeas que todo está ok. Imagínate el proceso en una mediana empresa, solicitas un cambio al equipo de IT, lo ejecutan semanas después, compruebas que está mal, lo vuelves a solicitar… una tortura.
En Tag Manager el proceso es inmediato, puedes chequear cualquier implementación ya antes de publicarla y en tiempo real.
6. Configuración de eventos fácilmente
La configuración de acontecimientos no es complicada mas es preciso tener unas nociones básicas de html (incluso javascript) para incorporar una pequeña línea de código sin cargarnos la web.
Con Tag Mánager esto se puede realizar de manera más fácil y sobre todo sin el peligro de que un mal cierre de etiqueta rompa el diseño de la página web.
7. Recursos y foros de discusión para aprender y solucionar dudas
GTM no tiene un equipo de soporte como tal como puede ser el de Google Ads. No obstante es una herramienta con mucha documentación en línea, blogs, foros de discusión donde consultar dudas e ir aprendiendo.
Principales desventajas:
1. Curva de aprendizaje
Google Tag Manager no es la herramienta más difícil del mundo pero sí es necesario unos conocimientos mínimos tanto de analítica como de desarrollo web para sacarle partido.
Desde entonces si quieres dominarla como el crack deentonces vas a precisar conocimientos técnicos y muchas horas de aprendizaje.
Cómo instalar Google Tag Manager paso a paso
Lo primero que tenemos que hacer es.
Panel primordial y panel de cuenta
Cada vez que accedamos a GTM, lo vamos a hacer a su panel primordial, donde nos aparecerán las cuentas a las que tenemos acceso.
Una vez dentro, clicamos en
Crear cuentay se nos abrirás una ventana donde iremos introduciendo los datos que nos piden y por último pulsaremos
Crear.
El proceso es bastante intuitivo y no tiene pérdida.
Dentro de la cuenta que terminamos de crear, navegaremos entre las distintas opciones a través de un menú principal y un sidebar a la izquierda.
El código que necesitamos introducir en nuestra página web, lo encontraremos en el menú principal:
Administrador > Instalar Google Tag Manager
Seguiremos las indicaciones de Google, introduciendo parte del código en la etiqueta <head> y otra parte en <body>. Caso de que utilicemos Wordpress, tenemos varias opciones:
Instalarlo a través de nuestro Theme:cada vez más plantillas dejan insertar código en áreas específicas de nuestro html.
Directamente en el fichero header.php: esta opción sólo es recomendable si tienes nociones de php.- A través de complementos específicos.
Personalmente no soy amigo de utilizar plugins si puedo hacer las cosas mismo ya que la cantidad de recursos innecesarios que cargan puede suponer un inconveniente. Por esta razón suelo escoger la opción uno o bien la 2.
Si tu web utiliza otro CMS o bien es un desarrollo a la medida el resultado final no cambia, una de las tag tiene que estar en <head> y la otra en <body>, mientras esto se cumpla la manera de implementación queda en un segundo plano.
“Consejo: Si tienes dificultad para instalar justo las etiquetas en head y body no te obsesiones y pierdas horas de trabajo, prueba si funciona apropiadamente si bien estén en otro lugar, no suele haber problemas de trackeo.”
“Consejo: Si tienes dificultad para instalar justo las etiquetas en head y body no te obsesiones y pierdas horas de trabajo, prueba si marcha apropiadamente si bien estén en otro sitio, no acostumbra a haber problemas de trackeo.”
¿Cómo saber si funciona?
De instante no hemos tocado nada a nivel de Analytics, asi que lo único que debemos revisar es si efectivamente el script se está “pintando” en el código fuente (CTRL + O bien).
Más adelante, cuando hayamos configurado nuestras primeras tag, utilizaremos la opciónpara revisar que todo está ok.
Cómo utilizar Google Tag Manager: conceptos y funciones de la herramienta
Veamos todo lo que puedes hacer una vez dentro de la herramienta.
Cuentas
En GTM podemos organizar nuestros diferentes proyectos/clientes en cuentas.
Contenedores
Cada cuenta por su parte puede estar compuesta por uno o bien múltiples contenedores. Cada contenedor tiene su ID de seguimiento.
Por ejemplo, si un proyecto tiene una web y una app, crearemos una cuenta con 2 contenedores, uno para la página web y otro para la app.
El menú principal está compuesto por 5 elementos:
Espacio de trabajo:donde realizar toda la implementación de analítica.
- Vista previa: sirve para probar si las tag o acontecimientos se están disparando.
- Enviar: opción para guardar los cambios que hayamos hecho.
Versiones:controlador de versiones donde quedan registrados todos los cambios. Muy útil para trabajar en equipo y a nivel de backup.
Administrador:donde realizar configuraciones a nivel de cuenta o de contenedor.
- Vista previa: sirve para testar si las tag o bien acontecimientos se están disparando.
- Enviar: opción para guardar los cambios que hayamos hecho.
El sidebar izquierdo se despliega cuando estamos en la opción del menú
Espacio de trabajo.
Es donde vamos a efectuar las configuraciones a nivel analítica.
Lo fundamental es saber para qué sirven estas tres:
Etiquetas, Activadoresy
Variables. Para explicarlo me serviré del ejemplo del pixel de seguimiento de Google Analytics.
Etiqueta: es lo que va a comprender el código de seguimiento. En exactamente la misma definiremos el activador y la variable.
Activador: es la acción o evento que dispara la etiqueta. En el caso que nos ocupa deseamos que se activa en todas y cada una de las páginas cada vez que se carga una página.
Variable: aquí detallamos el ID de seguimiento, UA-xxxxxxxxx-x
Conoce todas y cada una de las funciones que ofrece GTM aquí:
Cómo instalar el pixel de Google Analytics
Seleccionamos la opción Etiquetas del sidebar izquierdo y pulsamos en Nueva. Los pasos que vamos a seguir son:
Configurar la etiqueta. Escogemos la opción predefinida de Google Analytics Universal
Configurar la variable. Crearemos una nueva variable con nuestro UA.
Configurar el activador. Cuando le hemos dado a Nueva etiqueta, nos aparecían dos opciones:
Configurar etiqueta(que son los pasos que hemos efectuado previamente) y
Activación.
En el caso de GA, nos interesa que la tag se active en todas y cada una de las páginas para poder registrar todo el tráfico de nuestra página web. Por lo tanto elegiremos
página vistay más tarde
todas las páginas.
Cómo instalar el pixel de Google Ads
La dinámica es la misma, configuramos etiqueta, variable y activador.
Tenemos que rellenar como mínimo los datos de ID y etiqueta.
Estos datos los sacaremos de Google Ads.
Si previamente elegimos que el activador saltase en todas las páginas,
ahora nos interesa que sólo lo haga cuando el usuario llega a la
thank you page
para poder medir la conversión de la adquisición o bien lead.
Cómo instalar otros pixeles
Hemos visto que tanto Analytics como Google Ads tienen sus configuraciones predefinidas. Lo mismo ocurre con muchas de las herramientas más famosas del mercado.
Pero,
¿qué ocurre si queremos utilizar el pixel y no encontramos una configuración predefinida en Tag Manager?En estos casos escogeremos la opción de insertar HTML.
Cómo medir acontecimientos de llamada
Ahora vamos a ver
cómo podemos medir las llamadas con Google Tag Manager. La dinámica es la misma, pero ojo, ahora no medimos páginas vistas. Ahora lo que deseamos medir es en el momento en que un usuario hace clic en el botón de llamar.
Por ello escogemos Evento como género de seguimiento. Tanto la categoría como la acción podemos editarla como queramos. En el caso de que tengamos diferentes teléfonos en la página desarrollo web para empresa , podemos emplear como etiqueta variables integradas de GTM.
En este caso he elegido Clic url para luego en Analytics ver cuántas veces han clicado en todos y cada uno de ellos de los teléfonos.
En cuanto a la activación, elegimos los click que se hagan en número de teléfono. En este artículo puedes ver cómo se.
Otro evento, en este caso para medir hasta dónde llegan los usuarios haciendo scroll en la web. Misma configuración que para el trackeo de llamadas, la diferencia está en que en un caso así como etiqueta escogemos
Scroll Depth Threshold.
De esta forma, cuando analicemos el acontecimiento scroll en Analytics, vamos a poder ver cuántos acontecimientos se han disparado de usuarios que han llegado al 50 por cien de la página, al veinticinco por ciento … etc.
Para poder compendiar los datos de esos porcentajes, nos vamos a la configuración del activador.
Seleccionamos la opción
Profundidad de desplazamiento, y en porcentajes ponemos, separados por comas, los porcentajes de scroll que deseamos medir.
Cómo medir eventos de Youtube
Con Tag Manager también podemos saber si la gente visualiza los vídeos de nuestra página web, cuáles específicamente y durante cuántos segundos o bien porcentaje del vídeo han visualizado.
Volvemos a repetir la misma configuración que en eventos precedentes a menos que en un caso así escogemos Video Title y Vídeo Percent. De este modo vamos a saber qué vídeos se ven y en qué porcentaje se visualizan.
En cuanto al activador, elegimos el que está ya creado para Youtube:
Y lo configuramos marcando los porcentajes que creamos recomendables separándolos por una coma.
Cómo instalar el pixel de Fb, VWO, Optimizely… o cualquier herramienta que te propongas
Google prosigue trabajando y creando conectores de diferentes herramientas a fin de que la instalación sea más fácil. No obstante aún faltan algunas de las herramientas/plataformas de marketing digital más importantes como Facebook.
En estos casos, elegimos la opción HTML personalizado:
Introducimos nuestro pixel de Facebook (o la herramienta que vayamos a emplear).
Como activador, seleccionaremos todas las páginas o sólo ciertas, según nos interese o según cuál sea la misión del pixel.
Por ejemplo, podemos incorporar el pixel de Facebook en todas y cada una de las páginas de nuestra página web para obtener diferentes datos de navegación y audiencia que nos visita, o podemos escoger sólo la
thank you pageen el en el caso de que queramos medir conversiones cuando realizan una compra.
Y hasta aquí esta completa guía de Google Tag Manager.
Conclusiones
Como hemos visto las posibilidades que ofrece la herramienta son inmensas. Sin tener conocimientos avanzados de programación podemos llegar a medir acciones de los usuarios que no vienen configuradas nativamente en Analytics como los eventos de scroll.
Al final es una herramienta para hacer más en menos tiempo. Si quieres aprender más sobre productividad y la automatización de labores en el mundo del marketing on line te invito a que visites mi web.
Si te ha gustado el artículo, diseño web en merida o bien dudas en los comentarios a fin de que podamos saber tu opinión.
