tag-manager-marujeosem-lucia-marin2

Google Tag Manager: Marujeo Meeting 2015

Posted by Lucía Marín on Nov 7, 2015

Hola a todos! soy Lucía Marín y como ya sabéis o imaginareis, voy a hablar de nuevo de Google Tag Manager, jejej para qué variar, no? 

Aquí está mi presentación sobre GTM en el evento Marujeo Meeting de Málaga de este 7 de noviembre de 2015 (que acabo de realizar), espero que os haya gustado :)

tag-manager-marujeosem-lucia-marin1

Me acabo de hacer autónoma por fin :)) y actualmente ofrezco servicios de Tag Management y Analítica Web / CRO como consultora independiente. También dirijo y tutorizo el curso online de tag manager, el que podéis encontrar en “cursogoogletagmanager.com”, el único, el inigualable……. jejej

Muchas gracias a Glorixi y a Jorge de Marujeo SEM (ahora Marketineo) por invitarme y animarme a participar!!! y a todos los que habéis venido al Marujeo Meeting :)  por mi parte estoy encantada (soy de Graná y en Bilbao se echa de menos el sol !! )

Bueno tras las presentaciones vamos a empezar.

Vamos a dar por sentado algunas cosas que ya sabréis, qué es tag manager, para qué lo usamos, y cómo crear algunas mediciones y seguimientos básicos. Si queréis si queréis profundizar mucho más a fondo os recomendamos el curso online que imparto yo misma :)

¿Cómo podemos exprimir realmente la herramienta?

ETIQUETAS DE GTM: más que códigos de conversión

tag-manager-marujeosem-lucia-marin2

Como sabéis, cada vez hay más plantillas de etiquetas disponibles (Analytics, AdWords, Doubleclick, Linkedin, Clicktale, etc.), pero tenemos un único tipo de etiqueta que las puede contener a todas: LA ETIQUETA DE HTML PERSONALIZADA.

En ella podemos incluir casi cualquier código HTML o JavaScript, con lo que sus posibilidades de cambiar o añadir contenido, y de sumar utilidades o interactividad al sitio web son casi ilimitadas. Por ejemplo:

  • Podemos cambiar el diseño de la página (incluyendo CSS styles desde GTM) y seguir para ello el criterio que queramos: cambiarlo solo para algunas URLs, para unos eventos, en función de dónde venga el tráfico, etc.
  • También podemos lanzar pop ups de todo tipo (como el famoso y pesado pop up de suscripción, sin plugins!). Para activarlos nos basaremos en los comportamientos que queramos (que se haga scroll, que se cumpla un tiempo en página, etc.)
  • Y no solo eso, además de personalizaciones en tiempo real, al existir la posibilidad de leer y de generar cookies desde el propio tag manager, también se pueden hacer segmentaciones más permanentes. Tan chulas como marcar y distinguir a los usuarios vía cookie en función de si son nuevos o recurrentes para nuestro sitio web, de si han hecho login alguna vez, si han comprado previamente, etc.

En definitiva, con Google Tag Manager no solo vamos a poder insertar etiquetas de conversión, sino que podremos añadir todo tipo de funcionalidades al sitio web sin depender para ello al 100% del departamento o equipo técnico, sino que adquiriremos cada vez más competencias y capacidades.

Pero bueno, lo mejor va a ser ver algún ejemplo. Pero antes… sí o sí tenemos que hablar de variables.

VARIABLES…. ¿EINNN?

El potencial de tag manager si utilizamos las variables se multiplica. Son lo más complejo que hay dentro de GTM, y son parecidas a las variables de programación, ya que entre otras cosas sirven para almacenar y calcular datos en tiempo real (tanto estáticos como dinámicos). También se pueden usar para mejorar la información enviada y recopilada (sobre todo vía variables Javascript). Y aparte, por supuesto, se utilizan para definir activadores de etiquetas muy potentes y selectivos (no solo de página). 

En GTM contamos con un set de variables de variables predefinidas muy útiles, y aparte podemos crear todas las variables derivadas de éstas que necesitemos, y más variables personalizadas, creadas a medida.

  1. Las primeras variables a destacar son las de tipo Page. Estas variables recopilan la URL de la página actual, la que está activa en cada recarga del navegador. Y podemos extraer tanto la URL completa como por partes:  ruta, parámetros…
  2. Además podemos crear las mismas variables equivalentes para la URL de referencia o Referrer, la página desde la que se llega a la actual, con todas las posibilidades que conlleva. Por ejemplo, podemos activar o bloquear una etiqueta en función de la procedencia de la visita, podemos distinguir las entradas desde un dominio externo o desde un dominio concreto. Y algo muy clave en analítica, podemos mejorar y superar a la propia información de adquisición y navegación recopilada por herramientas de analítica web por defecto.
  3. Y en tercer lugar, otro grupo de variables predefinidas muy potentes son las de tipo Click. Nos permiten identificar a los elementos clicados en función de sus atributos ID, Class, su texto y su enlace de destino, entre otras cosas. Por ello, solemos usar estas variables para activadores de eventos de tipo click. Por ejemplo, para distinguir un clic en un enlace externo, lo que suele hacer es comparar {{Click URL hostname}} con el dominio del sitio. Es decir, comprobar si el enlace apunta a un dominio diferente del propio.

Por tanto, resumiendo en cuanto a lo que sería la navegación y las variables relacionadas: tenemos un primer paso, paso anterior o REFERRER. Un segundo paso, ya que de allí se va a la página actual o PAGE URL. Y un tercer paso, ya que podemos tener un CLICK URL para eventos click o un FORM URL para eventos formulario.

tag-manager-marujeosem-lucia-marin3

Y para que quede lo más claro posible, éste es el esquema-resumen de las partes de una URL que se pueden diferenciar vía variables en Google Tag Manager.

  • protocol: http, https, ftp…
  • hostname: nombre de dominio, es conveniente marcar “sin www”
  • path: ruta tras el dominio (desde la /), sin parámetros y sin hash
  • query: parámetros de consulta. Con query a secas sacamos todos los parámetros (sin la ? de delante). También podemos configurar la variable para extraer un parámetro concreto.
  • fragment: el fragmento o ancla de enlace, la parte tras la # (pero sin incluirla)

tag-manager-marujeosem-lucia-marin4

Por último, veamos un procedimiento para crear las variables derivadas de URL para los componentes que necesitemos.

  1. vamos al menú variables y damos a crear nueva
  2. elegimos tipo URL
  3. seleccionamos el componente
  4. y por último definimos de qué URL sacarlo (page, referrer, click, form u otra)

Ahora sí, ¡por fin! pasemos a los ejemplos :))

  1. Personaliza según procedencia del tráfico {{Referrer Hostname}} con por ej. una campaña de RRSS
  2. Personaliza según taggeado del tráfico {{URL Query}} con una campaña de AdWords. O según parámetros UTM de Google Analytics.
  3. Aprende a crear y guardar valores en una cookie, como el parámetro gclid si quieres hacer persistente la atribución a adwords (u otra campaña) y la personalización.
  4. Descubre cómo extraer los parámetros de consulta de un buscador avanzado y conocer mejor los patrones de búsqueda completos.

Como estamos viendo… Tag Manager acerca el marketing al desarrollo (si no puedes con ellos jejejeje…) Y, nuevamente, nos permite hacer cosas antes inalcanzables, haciéndonos menos dependientes de la ayuda técnica, y volviéndonos más técnicos a nosotros mismos… :))) Aprende y colabora!

VISTA PREVIA Y DEPURACIÓN DE GTM

Y como siempre… recuerda que hay que probar todo antes de publicar!! lo mejor de GTM (o una de sus mejores cosas) es su consola de Vista Previa y Depuración. La cantidad de información que puedes extraer de ella es increíble. Se trata de un entorno de pruebas donde sólo tú puedes ver el efecto que tendrán las etiquetas en el website.

Para cada evento de la izquierda (Pageview, DOM…) puedes saber:

  • Pestaña ETIQUETAS: qué etiquetas se activan y qué etiquetas no en ese evento concreto, más el detalle de cada una de las etiquetas (todos los campos enviados en ellas con las variables configuradas para rellenarlos, y también los valores, fíjate en los radio buttons de arriba). Por qué se activan las etiquetas y por qué no…
  • Pestaña VARIABLES: qué valor toma cada una de las variables predefinidas activas y de todas las variables creadas en Tag Manager, también para ese evento concreto. Recordemos que el valor de las variables puede cambiar para cada evento, que se recalculan cada vez que se accede a ellas.
  • Pestaña DATALAYER: qué capa de datos completa se está enviando en cada evento. Se incluye tanto la dataLayer generada por defecto por GTM (gtm.js, gtm.dom, …), como la añadida en el código de nuestro sitio web. La dataLayer también cambia en cada evento… Te recomiendo leer este post de Dorcas Alexander de Lunametrics sobre la dataLayer, si es que no lo has hecho ya…, brutal !! ;)

TRUCOS SOBRE ACTIVADORES DE TAG MANAGER

Y por último un par de trucos sobre los activadores:

  1. Configura ACTIVADORES GENÉRICOS para clic y form si deseas que Tag Manager te autodetecte todos estos eventos de partida, al igual que hace con los pageviews. El fin de estos activadores es hacer tests y debug únicamente. Son muy útiles para saber dónde y cómo activar una etiqueta antes incluso de crearla. Cómo hacerlo: crealos para todas las páginas (en Habilitar cuando: Page URL regEx .*) y para todos los eventos (en Activar: todos los clics / formularios).

tag-manager-marujeosem-lucia-marin52.  En cada evento, revisa las etiquetas que te interesa saber por qué se activaron, o por qué no, haciendo click en ellas, y haciendo scroll hacia abajo hacia Tags Fired On This Event, o Not Fired, y podrás ver sus Firing Triggers con todo lujo de detalles :)

tag-manager-marujeosem-lucia-marin6

Bueno, una vez más, espero que te haya gustado este post más esta presentación, desde luego ganas le he puesto.. jejej  Si es que sí ¿me ayudas a difundir? ;)

Y como siempre: ¡¡¡¡Muchas gracias por leerme!!!! :))

About the author

12 Comments

  • Jaime says:

    Genial, y súper útil gracias, ves posible incluso poder lanzar ese “pesado pop up de suscripción” al clicar en cerrar ventana? es solo una idea por una tasa de rebote muy alta que no nos explicamos, pero al menos queremos aprovechar la visita (que viene del SEM)

    • 22:16
      09 Nov 15
      administrator

      Lucía Marín says:

      Hola Jaime!! Muchas gracias :) jejej imagino que sí, si se puede hacer por JavaScript entonces sí (y parece que poderse, se puede).
      Sería intentar añadir la dataLayer cuando se ejecuta esta función (lo he probado con una variable de JS personaliza y va OK):

      var bPreguntar = true;
      window.onbeforeunload = preguntarAntesDeSalir;
      function preguntarAntesDeSalir()
      {
      if (bPreguntar)
      return “¿Seguro que quieres salir?”;
      }

      Lo he sacado de aquí: http://www.jasoft.org/Blog/post/TRUCO-Como-detectar-el-cierre-o-la-salida-de-una-pagina-Web.aspx.
      Habría que probar en todos los navegadores. Supongo que con JQuery habrá otras formas más “elegantes”… jeje
      Si quieres lanzar un popup en condiciones en lugar de un alert, pásale a un técnico ese código (y tu idea, vamos) para que te sustituyan el alert con la pregunta por una dataLayer de evento (donde activar una tag HTML con el pop up)… de primeras se me ocurre algo así.
      Saludos!!

      • Jaime says:

        Genial Lucía, muchísimas gracias, no me esperaba tanta ayuda :) Voy a probarlo a ver como funciona

  • @crispinel says:

    Muchas gracias Lucía x compartir esta info!

  • Luis Revuelto says:

    Muchas gracias Lucía. Un buen apoyo para todos los que nos estamos pegando con Google Tag Manager, ya que la documentacionde Google es escasa y poco detallada. Enhorabuena por tus ponencias, yo tuve la oportunidad de verte en Zaragoza y encantado, sigue así ;)

  • 20:02
    24 Nov 15
    administrator

    Lucía Marín says:

    Muchas gracias chicos! :) Luis, en Zaragoza no me quedé contenta 100%… qué te pareció el nivel? no sé si me fui a demasiado alto para tan poco rato… agradecería el feedback!! muchísimas gracias por venir a verme :))

    • Luis Revuelto says:

      Hola de nuevo Lucía! Personalmente me gustó, porque en ese momento no la conocía y me demostraste que tiene un gran potencial. Si bien es cierto que no es apta para todos los perfiles (el que no sepa nada de programación se puede perder un poco, aunque esta herramienta busca justo lo contrario). Y quizá la ponencia sería más práctica en modo taller, para poder ir probando lo que nos explicabas, eso es algo que eché de menos :(
      Pero seguro que la próxima vez le das el enfoque adecuado y cualquier cosa que podamos ayudarte, ej. por redes sociales, encantado ;)
      Suerte!

  • 22:18
    01 Dic 15
    administrator

    Lucía Marín says:

    Gracias Luis!! sí, es que el Congreso de Zaragoza merece un nivel alto la verdad, pero claro, luego el tema es llegar a todo el mundo. Pero siempre se aprende de cada experiencia :))
    Ya que dices jeje, me acabo de crear un nuevo perfil en Twitter para difundir GTM a saco, y para promocionar el curso online jeje ya que preguntas, se agradece una ayudita para darlo a conocer !!:)) El curso es http://cursotagmanager.com y el perfil https://twitter.com/TagManagerQueen.
    Y lo mismo digo, para cualquier cosa, por aquí estamos ;)
    Un abrazo, Lucía

  • Luis Revuelto says:

    Hecho Lucía! Acabo de compartirlo a mis seguidores, seguro que a alguno le interesa. Disculpa el retraso pero no sé porqué no tenía activadas las notificaciones de comentarios.

    Un abrazo!

Comparte tu opinión