Analítica web
Reflexiones desde el mercado español de Analítica Web

Dynamic Tag Manager : El nuevo gestor de etiquetas de Adobe

Se lee en 7 minutos

Hace unos meses os traíamos un post sobre el gestor de etiquetas de Google (Google Tag Manager) y las diferentes opciones que nos ofrecía. Hoy os venimos a hablar de otro, en este caso el “nuevo” Adobe Dynamic Tag Manager. Para contextualizar cómo y por qué ha visto la luz este gestor de etiquetas debemos remontarnos a mediado de 2013 cuando Adobe nos sorprendía con la adquisición de Satellite, un potente gestor de etiquetas que le daría a Adobe la posibilidad de competir de tú a tú con Google y su tag manager lanzado allá por 2012 y en constante evolución.

Veamos en detalle lo que este gestor de etiquetas nos proporciona para que podáis, cada uno de vosotros, evaluar los pros y los contras de la herramienta ante una hipotética integración de este gestor en vuestros sitios web.

Para la integración de Adobe Dynamic Tag Manager se deben seguir cinco pasos:

1- Creación de una propiedad dentro de la cuenta de ADTM, estas propiedades serán, o se recomienda que sean,  únicas por sitio web, varios subdominios o varios sitios web que se desean administrar de forma conjunta.

2- Integración de herramientas de analítica, testing, etc, en el contenedor anteriormente creado. Obviamente la integración con las herramientas Adobe Marketing Cloud es total (Adobe Analytics, Adobe Target,…), pero también se ha incluido la integración con Google Analytics Classic y Universal:

ADTM_AddTool

3- Creación de las reglas de carga. Existen reglas de carga condicionadas a eventos o a la propia carga de página. Como regla básica se recomienda la creación de una regla de lanzamiento para todas las páginas, y en virtud a nuestras necesidades con cada herramienta ir añadiendo las más específicas.

4- Configuración de las herramientas añadidas en el paso 2. Adobe Dynamic Tag Manager nos permitirá utilizar recursos propios (data elements, asignación de variables de forma visual,…) o bien recurrir a la integración vía JavaScript, que para una integración avanzada puede ser muy útil.

5- Por último, se debe integrar el código de Adobe Dynamic Tag Manager en todas las páginas de los sitios web objeto de medición. El código consta de dos etiquetas:

1. Header code: Adobe recomienda que se incluya dentro de la cabecera HTML de todas y cada una de las páginas de nuestro sitio web, lo más próximo a la apertura (etiqueta <head>):

ADTM_HeaderCode

2. Footer code: Deberá ser incluida justo antes de la etiqueta HTML de cierre del cuerpo de cada una de las páginas de nuestro sitio web (etiqueta </body>):

ADTM_FooterCode

Existen dos versiones de estas etiquetas, una para los entornos de desarrollo o pre-producción (la etiqueta de la cabecera tendrá el sufijo “-staging”) y otra etiqueta para los entornos de producción (etiqueta idéntica a la anterior pero sin el sufijo “-staging”). La etiqueta del footer es idéntica para los diferentes entornos.

Ejemplo de etiquetas:

<!-- HEADER CODE STAGING -->
<script src="//assets.adobedtm.com/<identificador_cuenta_ADTM>
/satelliteLib-<identificador_contenedor_ADTM>-staging.js"></script>

<!-- HEADER CODE PRODUCTION -->
<script src="//assets.adobedtm.com/<identificador_cuenta_ADTM>
/satelliteLib-<identificador_contenedor_ADTM>.js"></script>

<!-- FOOTER CODE STAGING/PRODUCTION -->
<script type="text/javascript">_satellite.pageBottom();</script>

Como veremos a continuación la integración de una nueva herramienta en Adobe Dynamic Tag Manager es algo sencillo, para verlo con un ejemplo mostraremos el detalle de una integración de Adobe Analytics sobre un contenedor de pruebas.

Lo primero que debemos hacer es acceder a nuestra cuenta de Adobe Dynamic Tag Manager, una vez dentro veremos la lista de contenedores que tenemos definidos y en el caso de querer crear uno nuevo, la herramienta nos da la opción desde esta misma pantalla mediante un botón “Add Property”:

ADTM_AddProperty

Iremos al contenedor correspondiente y haciendo clic sobre el nombre, la herramienta nos conducirá a la página de configuración del contenedor donde se podrán añadir nuevas herramientas, nuevos tags, crear y administrar reglas, etc, para el contenedor seleccionado:

ADTM_ContainerDetail

Antes de ir a la integración propia de la herramienta veamos las diferentes secciones de la consola de administración de un contenedor concreto.

La consola de administración está dividida en una serie de pestañas donde se nos proporcionan una serie de opciones de configuración para nuestro contenedor:

ADTM_SectionsContainer

  • Overview: Nos da una visión global de los elementos del contenedor (herramientas, tags, usuarios,…),  ofreciéndonos las opciones de publicar y editar el contenedor que hemos seleccionado.
  • Rules: Sección para la gestión de las diferentes reglas del contenedor, así como la creación y definición de los data elements (variables de uso global dentro de la herramienta).
  • Approvals: En esta pestaña se nos mostrarán los diferentes cambios que hemos realizado de una versión a otra del contenedor. Si éstos no son aprobados no se verán reflejados en nuestro sitio web. Es muy importante indicar que un cambio aprobado puede ser revisado desde “-staging” y mientras el contenedor no sea publicado este cambio no se verá reflejado en el entorno de producción (huella sin el sufijo “-staging”).
  • History: Nos dará una visión del histórico de cambios realizados segmentado por días. En cada cambio se indicará el usuario que lo ha realizado así como el detalle del mismo (nuevo, modificación o eliminación). Cada cambio puede ser a su vez editado en el caso de que necesitáramos deshacerlo.
  • Embed: Aquí nos encontraremos los códigos a integrar en nuestro sitio web así como el servidor, de los que nos proporciona Adobe, donde queremos que esté alojado nuestro contenedor (Akamai, Amazon S3,…).

Una vez repasadas las diferentes secciones de la consola de administración de Adobe Dynamic Tag Manager, nos dirigimos a la pestaña overview desde donde poder añadir la herramienta Adobe Analytics que veremos como ejemplo de integración. En la sección “overview” debemos ir al botón Add a Tool y seleccionaríamos dicha herramienta en el listado:

ADTM_AddTool

Una vez la hemos añadido a nuestro contenedor, debemos configurar las diferentes variables que harán que la información sea enviada al contenedor de Adobe Analytics adecuado. Para configurar la herramienta debemos dirigirnos a la página inicial donde se encuentra el listado de herramientas y clicar en el icono de la derecha del nombre de la herramienta que deseamos configurar. Una vez dentro, se nos mostrarán una serie de pestañas plegadas que podemos ir desplegando para configurar dentro de ellas los diferentes datos. A continuación os explicamos que os encontraríais en cada una de las pestañas en la integración de Adobe Analytics:

ADTM_AdobeAnalytics

  • General: Permitirá configurar variables generales de Adobe Analytics como pueden ser Character Set, Currency code, Tracking server,
  • Library Management: En esta pestaña nos encontraremos las opciones de integración de la librería que contendrá la lógica de seguimiento de Adobe Analytics, el conocido fichero “s_code.js”. En Adobe Dynamic Tag Manager se nos permitirá integrar de forma estándar la última versión existente del fichero (con la opción “Manager by Adobe”), o bien una la lógica personalizada mediante un fichero creado por nosotros , que podremos tener alojado en el propio Adobe Dynamic Tag Manager (copy & paste en ADTM) o en nuestro servidor y simplemente añadir la ruta.

En esta pestaña además se permite seleccionar si queremos que se cargue la librería al inicio o al final de la página.

  • Global Variables: Nos proporciona la gestión dinámica de nuestras variables de tráfico (prop’s) y conversión (eVar’s) de Adobe Analytics, pudiéndoles asociar una cadena constante o data elements que crearemos en el contenedor correspondiente de nuestro gestor de etiquetas. Estas variables también podrían definirse mediante código JavaScript dentro del fichero “s_code” y será el usuario quien deberá elegir la opción que más se adapte a sus necesidades.
  • Pageviews & Content: Pestaña para la definición de las variables pageName, Channel, Hier’s y Page URL. Nuevamente a estas variables se les podrá asignar data elements o valores constantes y podrán definirse mediante código JavaScript dentro del fichero “s_code” o directamente en la consola de ADTM.
  • Link tracking: La integración de Adobe Analytics con Adobe Dynamic Tag Manager nos permitirá en esta pestaña realizar el seguimiento de forma automática de diferentes eventos como pueden ser descargas o enlaces de salida. En ambos casos Adobe nos facilita una serie de opciones de personalización como extensiones de ficheros a seguir o la definición de los dominios que deben ser considerados o no de salida.
  • Referrer & Campaigns: En esta opción se permite al usuario definir los referentes que no deben ser tenidos en cuenta y los parámetros de campaña a considerar en la variable “campaigns” de Adobe Analytics.
  • Cookies: Se podrán definir en esta pestaña las cookies propias de Adobe Analytics: VisitorID, Visitor Namespace,…
  • Customize Page Code: Por último tendremos la pestaña Customize Page Code en donde se permite al usuario la inserción de código JavaScript que se cargará inmediatamente antes del final de la carga de todas y cada una de las páginas en las que se haya incluido la huella de Adobe Dynamic Tag Manager. En esta sección podrían incluirse eventos asíncronos personalizados mediante funciones de escucha que permanezcan a la espera de algún tipo de acción por parte del visitante. Por ejemplo de la realización de un clic sobre un determinado botón.

Como veis Adobe ha integrado a la perfección su herramienta de analítica con su nuevo gestor de etiquetas, lo cual nos permite realizar una configuración bastante avanzada a nivel de consola, es decir sin necesidad de pelearnos con código JavaScript. Si bien es cierto que para una integración avanzada, como sucede en todos los gestores de etiquetas, es aconsejable entrar a nivel de código.

Esperamos que este post os haya servido para conocer el nuevo gestor de etiquetas de Adobe y lanzaros a realizar vuestras primeras integraciones.

Si lo has utilizado déjanos conocer tu experiencia. Y si no lo has utilizado aún ¿a qué estas esperando? 🙂

6 Comentarios

  1. Personalmente, me gusta más el DTM que el GTM, es mucho más sencilo de configurar y más usable, aunque quizás sea menos potente y versátil.

    • Adrián Felgueroso Responder

      Gracias por tu comentario Jordi.

      Dependiendo de la integración que se vaya a realizar sobre el sitio web será más aconsejable uno u otro, ambos son gestores de etiqueta bastante potentes sobre todo con las herramientas de sus suites. En cuanto a versatilidad si que puede dar la sensación que GTM es más fácil de manejar pero ADTM tiene una curva de aprendizaje bastante rápida.

      De todas formas ambos tienes pros y contras 🙂

      Saludos.

  2. Buen post, felicidades. Creo que el Adobe DTM aún tiene mucho por mejorar, y que para implementaciones de gran cantidad de páginas deberían añadir alguna funcionalidad para hacer cambios en bulk.

    También falla en la faceta de las event rules, que a priori te deberían permitir ejecutar reglas sólo con identificar los elementos HTML, pero hay veces en las que no reconoce los clicks en botones (especialmente en AJAX) y tienes que terminar tirando de Jquery/JS. En cuanto lo mejoren, será perfecto para marketers sin conocimiento de código, ya que les permitirá lanzar todo tipo de tags sin tener que tocar casi nada de código.

    Por último, pese a que visualmente parece muy usable, aún tiene pequeños fallos de usabilidad que te encuentras cuando trabajas con la herramienta, y tendrán que ir mejorando… Supongo que al ser una herramienta que Adobe adquirió de Satellite a principios de año, aún está en proceso de adaptación…

    • Adrián Felgueroso Responder

      Hola Martí.

      Muchas gracias por tu comentario.

      Sí, Adobe Dynamic Tag Manager aún está en evolución y seguro que Adobe irá mejorando estas cosillas para hacerlo más fácil de usar, tanto a usuarios de nivel avanzado como a los usuarios con un nivel bajo de programación. Como comentamos en el post para una implantación avanzada es recomendable utilizar JavaScript, ya que nos dará mucha más flexibilidad, lo mismo sucede con la mayoría de gestores de etiquetas existentes en el mercado :).

      Saludos.

  3. Yo llevo unos meses usándolo y la verdad es que me parece muy bueno y fácil de usar.
    Las carencias principales son a mi juicio:
    La ausencia de plantillas para pixeles de marketing, todo se hace a través de custom script y html.
    La búsqueda de reglas en función del contenido. Solo busca en funcion de metadatos (o sea que hay que incluirlos a mano)
    Muy bueno el debugger .Además hay plugins para los principales navegadores (para cambiar a debugger o staging)…
    En fin. Buena herramienta.

Escribe tu comentario

20 − cuatro =

Navegar