¿Qué es Gtag y cómo implementarlo para App + Web?

Índice de contenidos

¿Qué es Gtag (Global Site Tag)?

Gtag es una etiqueta de seguimiento que nos permite unificar los productos de Google y que está basada en eventos predefinidos.

Lleva activo desde 2017, pero es ahora con el lanzamiento de las propiedades de App + Web cuando realmente parece que se empieza a poner en marcha y resulta realmente útil para poder estandarizar y aunar la medición de nuestras apps y webs. (Aunque también puedes implementarlo sólo para web o sólo para app).

Pero vamos, que al final nos sirve a todos para poder estandarizar la medición de la analítica. Ahora, nos empezamos a plantear cómo comenzar a migrar toda la analítica de nuestra web hacia estas nuevas propiedades.

Sin embargo, hay que tener en cuenta que a las propiedades de App + Web están en beta y  todavía le faltan muchas características como comercio mejorado, búsquedas, agrupaciones de contenido…

Por ello, y teniendo en cuenta el nivel de desarrollo del proyecto por parte de Google, de momento, la forma más correcta de hacerlo es manteniendo la implementación actual y hacer un doble etiquetado de la web. Por un lado, como lo estemos haciendo hasta ahora y por otra parte con Gtag (modelo App + Web, no Universal).

En un futuro, se podrá hacer la migración completa.

Funcionalidades de App + Web 

  • Medición mejorada: Mide automáticamente algunos eventos comunes, como los vídeos, las descargas de documentos o el scroll. Solo con activarlo en la consola.
  • Embudos abiertos o cerrados: Permite construir embudos basados en el valor de los parámetros (Firebase Console sólo basado en el nombre de los eventos).
  • Explorador de usuarios
  • Análisis de rutas
  • Creación de audiencias por hit, sesión o usuario. Las audiencias incluyen criterios de tiempo y los usuarios pueden salir cuando dejan de cumplirlo.

En este post acerca de Gtag + Tag Manager, mi compañero Óscar lo explica con más detenimiento.

Instalar el fragmento global

El fragmento global debe estar al principio de cada página de tu web. Si el fragmento global no se añade al principio de una página, donde se ejecutan los comandos gtag(), no se podrán enviar datos usando comandos gtag().

Cada producto compatible genera etiquetas que pueden copiarse y pegarse en las páginas web. 

También puedes crear un fragmento personalizado. 

Para implementarlo, es tan simple como meter el siguiente fragmento en el <head> de todas las páginas de la web, vamos, como con Universal Analytics. Simplemente, sustituye el GA-TRACKING_ID por el ID correspondiente de tu propiedad.

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=GA-TRACKING_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'GA-TRACKING_ID');
</script>

Este fragmento carga la biblioteca gtag.js, asigna el ID de propiedad predeterminado de Google Analytics GA_MEASUREMENT_ID y envía un hit de página vista a Google Analytics.

Además, podemos recoger la información de todos los eventos para otras herramientas de Google como: Adwords (perdón, Google Ads), Double Click o Universal Analytics. Basta con añadir el tracking ID de cada herramienta.

 window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());

    gtag('config', 'UA-XXXXXXX-Y');
    gtag('config', 'AW-XXXXXXXX'); // Conversion ID, en el caso de evento de compra.

Configurar productos y enviar datos

Puedes invocar comandos gtag() desde cualquier lugar de una página, después del fragmento global. Puedes utilizar tres comandos: config y set se usan para definir las propiedades generales, mientras que event se usa para enviar datos.

Inicializar productos con config

Usa el comando config para inicializar y configurar los ajustes de una cuenta de producto concreta. El comando config tiene el siguiente formato:

gtag('config', '<target_ID>', {<additional_config_info>});

<target_ID> es el ID de la cuenta de producto a la que quieres enviar datos, y <additional_config_info> es un objeto opcional que se utiliza para especificar otras opciones de configuración.

El comando config sirve para eventos que queremos lanzar en el momento en el que se ve una página concreta.

Por ejemplo, cuando llegamos a una /thankyou page, utilizaremos el comando config para lanzar el evento de pageview.

El comando config te permite especificar qué productos y cuentas debe gestionar gtag.js, así como la configuración asociada. En función del producto que se haya especificado en target_ID, el comando config iniciará un comportamiento específico para ese producto. 

Por ejemplo, en algunos casos, el comando config indica a gtag.js que inicie un hit de páginas vistas. 

El ejemplo más básico de este comando consiste solo en el comando config y un target_id:

gtag('config', 'GA-TRACKING_ID');

Para ajustar y ampliar un comando config, especifica parámetros en el objeto opcional <additional_config_info>. 

Por ejemplo, si añades el siguiente parámetro, impedirás que se envíen automáticamente los hits de páginas vistas de Google Analytics:

gtag('config', 'GA-TRACKING_ID', {'send_page_view': false});

Envío de eventos

Hemos de tener en cuenta que ahora la forma de funcionar es diferente a como veníamos haciéndolo. Gtag funciona como GA4F (Google Analytics for Firebase) y todo va a través de eventos que tendremos que definir nosotrxs mismxs.

Dentro de los eventos que enviemos a Gtag, es bueno tener en cuenta:

  1. Siempre que sea posible usaremos eventos y parámetros recomendados.
  2. No se debe usar un nombre de parámetro para dos significados distintos.
  3. Los eventos no deben ser ni demasiado genéricos (clic), ni demasiado específicos (clic de descarga de la app v5).
  4. Un punto intermedio sería “clic descarga” y en dos parámetros especificar que la descarga es la app y es la v5.

Enviar datos con event

El comando event te permite enviar datos de eventos, cuando estos son interactivos, es decir, acciones que debe realizar el usuario, como un clic o por ejemplo, puedes usar el comando event para enviar un evento de login con el valor «Google» asignado al method.

gtag('event', 'login', {
  'method': 'Google'
});

Hay un conjunto de eventos recomendados y parámetros recomendados que son útiles en contextos específicos. También puedes enviar eventos personalizados que no están incluidos en la lista de eventos recomendados.

Enviar datos para cada evento con set

El comando set te permite establecer los parámetros que se asociarán a eventos concretos cada vez que se activen en la página. Es decir, son los datos del dataLayer, la información que enviaremos con cada evento para que sea reconocible y nos permita analizar los datos de las acciones de los usuarios.

Por ejemplo, si se usa la misma moneda en todas las transacciones de tu sitio web, incluye el comando set para especificar el valor del campo currency.

gtag('set', {'currency': 'EUR'});

Puedes establecer varios atributos con un único comando set:

gtag('set', {
  'country': 'ES',
  'currency': 'EUR'
});

Medir los eventos

El dataLayer que deberemos crear para medir los eventos con gtag a nivel de código es igual que si fuera para una aplicación.

gtag('event', <action>, {
  'event_category': <category>,
  'event_label': <label>,
  'value': <value>
});
  • <action> es la cadena correspondiente a la acción del evento en los informes «Eventos» de Google Analytics.
  • <category> es la cadena correspondiente a la categoría del evento.
  • <label> es la cadena correspondiente a la etiqueta del evento.
  • <value> es un número entero positivo que corresponde al valor del evento.

Eventos predeterminados de Gtag

gtag('event', 'login', { method : 'Google' });

Eventos sin interacción

Para enviar un evento sin interacción, asigna el valor true al parámetro non_interaction:

gtag('event', 'video_auto_play_start', {
  'event_label': 'My promotional video',
  'event_category': 'video_auto_play',
  'non_interaction': true
});

Configuración desde GTM

Es la opción más sencilla ya que nos permite ser nosotrxs mismos los que establecemos la configuración sin tener que depender demasiado de los equipos de IT.

Etiqueta de configuración

  • Define las cookies.
  • Envía eventos automáticos y de medición mejorada.
  • Determina ajustes comunes de eventos posteriores (equivale a la variable de configuración).
  • Se debe activar en TODAS las páginas y lo antes posible.

Etiqueta de evento

  • Para el resto de eventos.

Si usamos GTM, la implementación en web es mucho más sencilla:


Advertencia sobre App + web

Como comentaba arriba, App + Web todavía está en beta, por lo que hay que tener en cuenta que hay ciertas cosas que no acaban de funcionar correctamente.

Algo bastante relevante es que no hay forma de enviar la matriz de elementos [item_list] (o cualquier otro objeto multidimensional) como parámetro de evento a Google Analytics cuando se usa GTM.

Enlaces de interés:

Te animamos a probarlo y a que nos escribas en los comentarios tus dudas (si las tienes). 🙂

Share on facebook
Share on twitter
Share on linkedin
Share on email
5 min
Suscríbete a nuestra newsletter

Los mejores artículos de analítica digital para potenciar tu negocio.

Deja un comentario

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

Entradas relacionadas

Guía básica para crear una propiedad Google Analytics 4

Google Analytics 4 (GA4) es la nueva generación de Google Analytics, antes conocida como Google Analytics App+Web. El lanzamiento de GA4 comporta la llegada de nuevos informes y capacidades que dan más potencia a tu herramienta de analítica. Para empezar a familiarizarte con ella, te explicamos paso a paso cómo crear una propiedad GA4 y

Todo lo que necesitas saber sobre el lanzamiento de GTM server-side

Hasta ahora, las soluciones de tag managers como GTM se basaban en inyectar una librería y procesar toda la información en el navegador, ejecutando las solicitudes de seguimiento directamente desde el lado del cliente (navegador) a servidores de terceros. Con la llegada del nuevo contenedor de GTM server-side se agrega una capa adicional de administración

BigQuery Omni: nueva herramienta multi-cloud de GCP para el análisis de datos

Lanzamiento BigQuery Omni BigQuery Omni de Google Cloud es una nueva solución multi-cloud de análisis de datos, impulsada por Anthos, la plataforma de Google que integra aplicaciones híbridas y multi-cloud.  Omni permite a los usuarios ejecutar BigQuery para analizar datos de las nubes de Amazon AWS y Microsoft Azure.  El coste de mover datos entre

Cómo el ITP de Safari afecta a tus decisiones con Google Analytics y A/B testing

Con el Intelligent Tracking Prevention o ITP, Safari restringe el uso de las cookies para el seguimiento del comportamiento de los usuarios en cualquier página web. En su versión 2.0, el ITP empezó a bloquear únicamente las cookies cargadas por servidores de terceros en todos los sitios web. Por tanto, desde que apareció esta versión,

Ir arriba

Esta web utiliza ‘cookies’ de terceros. Al clicar aceptar está aceptando el uso que realizamos de las cookies. Para más información puede consultar nuestra Política de cookies