Google Tag Manager.
Mucho se habla de Google Tag Manager o GTM, pero pocos saben utilizar la herramienta en toda su potencialidad.
En Marketing Branding hemos creado el siguiente recurso para resumir qué es GTM, por qué es importante y los 8 beneficios clave que entrega.
Adicionalmente, 10 super recetas para introducir en una web.
Chécalo aquí.
¿Qué es Google Tag Manager?
Google Tag Manager (GTM) es una herramienta gratuita de Google que nació para simplificar la instalación de códigos, activaciones especiales y comandos dentro de una página web.
Todo bajo la aplicación de las llamadas etiquetas y los contenedores.
Su instalación es sencilla. Basta hacer una cuenta en la web oficial, luego poner el script de GTM en el head del código fuente una página web y listo.
Desde allí en adelante todo nueva activación de etiquetas se podrá hacer desde el panel de Google Tag Manager, sin tener que volver editar el código nuevamente.
Como mencionamos previamente, Google Tag Manager permite activar una serie de etiquetas o recetas cuyo beneficio es poder hacer un análisis del sitio web, hacer un seguimiento de conversiones, activar el remarketing, entre otras actividades.
¿Qué son las etiquetas de Google Tag Manager?
Las etiquetas son fragmentos de código del sitio web que miden el tráfico y el comportamiento de los visitantes.
Pero para enteder lo que son las etiquetas o tags y los demas aspectos de esta herramienta, bien vale explicar brevemente cada uno:
- Tags o Etiquetas: en buen castellano, es un código que envía datos a un sistema o a una plataforma, como Google Analytics.
- Trigger o Activador: un activador responde ante ciertos eventos, como clics, envíos de formularios o cargas de páginas y ejecuta «algo». Cuando se detecta un evento que coincide con la definición del Activador, se ejecutará cualquier Tag o Etiqueta que haga referencia a ese Activador.
- Variable: la variable es un «placeholder» que cambiará con la ejecución del Trigger o Activador, como el nombre de un producto, un valor de precio o una fecha.
- Data Layer o Capa de Datos: GTM implementa una capa de datos para retener temporalmente los valores en el cliente para que puedan ser utilizados por Etiquetas, Activadores y Variables.
Etiquetas y Activadores
En una página web o en programación en general, las etiquetas pueden servir para una variedad de usos, pero la mayoría están diseñadas para enviar información de medición desde una página web a un tercero.
Con Google Tag Manager se puede controlar todas las etiquetas desde una interfaz de usuario web.
Por ejemplo, la etiqueta de Google Analytics y la etiqueta de conversión de Google Ads.
Las etiquetas se ejecutan o disparan en respuesta a eventos. Los eventos pueden ser:
- Cargas de página
- Clics en botones
- Desplazamientos de página
- Conversiones
- Etc.
En Google Tag Manager el usuario define Activadores para responder ante esos eventos y especifica cuándo deben activarse las etiquetas.
Activadores y Variables
Google Tag Manager tiene muchas variables integradas para elegir y permite configurar variables personalizadas adicionales.
Por ejemplo:
La variable predefinida «URL» contiene la dirección de la página cargada actualmente por el visitante.
Si se desea que una etiqueta se active sólo en la página ejemplo.com/compra/recibo.html hay que definir un activador con esta configuración:
- Evento: Page View
- Tipo de Activador: Page View
- Activar en: Some Page Views
- Activar la etiqueta cuando las siguientes condiciones son verdaderas:
La URL contiene ejemplo.com/compra/recibo.html
- Activar la etiqueta cuando las siguientes condiciones son verdaderas:
Variables y Capa de Datos
La capa de datos se utiliza para almacenar datos temporalmente.
Es un formato estructurado que Google Tag Manager entiende para facilitar la transferencia de esos datos desde una página web o app móvil a Etiquetas, Activadores y otras Variables en GTM.
No es necesario configurar una capa de datos para que las variables recuperen información.
Las variables de Google Tag Manager también se pueden configurar para recuperar valores directamente de las variables de JavaScript, cookies de origen, del DOM.
Sin embargo, la mejor práctica es que sus variables recuperen información directamente de un objeto de capa de datos bien organizado.
La implementación de una capa de datos puede minimizar la probabilidad de pérdida de datos por cambios de código inadvertidos, fomentar un modelo de datos bien organizado y accesible y simplificar la resolución de problemas.
¿De Qué Sirve Usar Google Tag Manager y Aplicar un Sistema de Gestión de Etiquetas?
Lo primero es que resuelve algo muy importante: sin Tag Manager el etiquetado es complejo.
Las páginas web más grandes, como los ecommerce o retailers, necesitan actualizar constantemente sus etiquetas, agregar nuevas y ejecutar instalaciones complicadas.
El problema es que si todo esto no se gestiona correctamente, las etiquetas pueden ralentizar una página web, tergiversar sus medidas y generar costos duplicados y datos faltantes.
Además, la administración de etiquetas sin un sistema lleva mucho tiempo, y hacerlo puede retrasar importantes programas de marketing y medición.
8 Beneficios de Google Tag Manager
1. Facilidad de Uso
Como dijimos ya, Google Tag Manager permite a los miembros de un equipo realizar actualizaciones y agregar nuevas etiquetas de forma rápida y sencilla, sin complejos cambios de código en un sitio web.
Esto permite que un equipo interno pruebe cada cambio e implemente cuando éste esté listo, sin la ayuda de un desarrollador, lo que a la larga colabora en:
- Agilizar el proceso
- Acelerar el tiempo de lanzamiento
- Permite que el departamento de TI se concentre en proyectos más grandes
2. Actualizaciones Sencillas
GTM simplifica mucho las futuras actualizaciones y mejoras, ya que las modificaciones se pueden realizar a través de la interfaz de Tag Manager y no en cada página del sitio web o entrar al código.
Además, si se está considerando actualizar a Universal Analytics, las actualizaciones de GTM facilitarán mucho la transición gradual.
3. Funciones de Depuración
Las funciones de depuración (o corrección de errores) integradas de GTM permiten a un equipo el probar y depurar cada actualización en una página web antes de la publicación.
Todo esto garantiza que las etiquetas funcionen correctamente antes de que estén activas.
4. Control de Versiones
Esto es interesante. En Google Tag Manager se crea una nueva versión archivada cada vez que se publica un cambio.
Todo esto facilita la reversión a una versión anterior en cualquier momento.
Esto es ideal para:
- Mantener las etiquetas organizadas
- Simplificar la resolución de problemas
- Implementar fácilmente instalaciones similares en nuevos contenedores GTM.
5. Gestión de Usuarios y Permisos
Pareciera ser algo irrelevante, pero es todo lo contrario.
Google Tag Manager facilita la configuración de permisos para usuarios individuales.
De esta manera se puede controlar internamente quién tiene la capacidad de realizar cambios en una página web y ayuda a crear etiquetas, macros y reglas.
6. Etiquetas Integradas
Google Tag Manager viene con una serie de etiquetas integradas importantes para Classic y Universal Analytics, conversiones de Google Ads, remarketing y más.
Esto permite que un equipo de marketing que carece de experiencia en codificación personalice las etiquetas con sólo algunas piezas de información clave, sin implementar un código complicado ni contar con la ayuda de un desarrollador.
7. Funciones con Google Analytics
En relación a las etiquetas integradas, Google Tag Manager también permite instalar una implementación básica de Google Analytics.
Además, es compatible para activar seguimiento de eventos, visitas a la página y seguimiento entre dominios.
8. Seguimiento de Eventos
Tradicionalmente, el seguimiento de eventos implica el agregar código a un sitio web para rastrear eventos de visitantes como clics, participación de video y envíos de formularios.
La función de seguimiento automático de eventos de Google Tag Manager elimina la necesidad de etiquetar manualmente cada vínculo que se desea rastrear.
En su lugar, se puede orientar enlaces o botones por atributos que ya están en el enlace o mediante una estructura de nombres estandarizada.
Instalación de Google Tag Manager
Como mencionamos antes, este proceso es relativamente simple.
Primero hay que ir a la web oficial de Google Tag Manager y registrarse para tener el script.
Para instalarlo en una web, se debe colocar el script de GTM en el <head>, tan alto como sea posible.
Si el script ya se encuentra presente en la web, éste no debe ser agregado nuevamente.
Asimismo, debe pegarse otra etiqueta inmediatamente después de la etiqueta <body> de apertura.
Nuevamente, si el script ya se encuentra presente en la web, éste no debe ser agregado nuevamente.
Las Mejores Recetas de Google Tag Manager
En esta sección mostramos los scripts que se deben ejecutar para medir las interacciones de los usuarios en una página web.
- Dimensiones Personalizadas en Google Tag Manager
- Control de Usuarios en Google Tag Manager
- Registro de Usuarios
- LOGIN
- Acciones en el Home
- Slider Principal – Impresión de Banners
- Slider principal – Clic en banners
- Oferta de la Semana – Impresión de Banners
- Oferta de la Semana – Clics de Banners
- Listas – Impresión de Productos
- Listas – Clic en Productos
- Productos Destacados – Impresión de Productos
- Productos Destacados – Clics en Productos
- Variantes y Categorías de Productos
4.1. Impresión de Productos
4.2. Clic en Productos - Ficha de Producto
5.1. Detalle de Producto
5.2. Impresión de Productos Relacionados
5.3. Clic en productos relacionados - Bolsa de Compra
6.1. Agregar a la Bolsa
6.2. Retirar de la Bolsa
6.3. Selección Botones - Proceso de Compra
7.1 Checkout – Paso 1
7.2 Checkout – Paso 2
7.3 Compra Satisfactoria
7.4 Selección Realizar Pedido
7.5 Selección Pagar
7.6 Confirmación de la Compra - Interacciones
8.1. Menú
8.2. Suscripción
8.3. Filtros
8.4. Contacto
8.5. Lista de Deseos
8.6. Comparador
8.7. Vista Rápida
8.8. Vista Rápida – Producto
8.9. Ordenar por
8.10. Compartir - Blog
9.1. Impresión de Notas
9.2. Clic en Notas
1. Dimensiones Personalizadas en Google Tag Manager
Las dimensiones personalizadas permiten diferenciar el estado de los usuarios (loggeados y no loggeados).
Nota: Estos scripts se deben ejecutar en el head, antes del código de Google Tag Manager.
Cuando cargue una página y el usuario no ha iniciado sesión, es decir, está como invitado, se debe enviar el siguiente script.
dataLayer =[{
‘loginStatus‘: ‘Sesión no iniciada’
}];
Al iniciar sesión debe modificarse el valor del tag para expresar el nuevo estado del usuario, además se debe agregar el campo userId.
Este script también debe enviar cuando cargue una página y el usuario ya cuenta con sesión iniciada.
dataLayer =[{
‘loginStatus‘: ‘Sesión iniciada’,
‘userID‘: ‘{userID}‘
}];
Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación:
Variable | Descripción | Posibles Valores |
userID | Identificador del usuario que ha iniciado sesión. Nota: Google Analytics no permite el envío de datos personales como el DNI, correo electrónico, etc. Google recomienda tener las siguientes consideraciones: • Enviar un ID de base de datos, autogenerado. • De no poder generarse un ID de base de datos, deberá enviarse un dato personal cifrado en formato SHA-256. | Ejemplos: ·12ad433f34 ·454ab434cd ·Etc. |
2. Control de Usuarios en Google Tag Manager
2.1 Registro de Usuarios
Cuando un usuario se registra satisfactoriamente, se ejecutará el siguiente evento:
dataLayer.push({
‘event‘: ‘virtualEvent’,
‘category‘: ‘Registro’,
‘action‘: ‘Registro satisfactorio’,
‘label‘: ‘(not available)’
});
2.2. LOGIN
Cuando un usuario inicie sesión satisfactoriamente, se deberá ejecutar el siguiente script:
dataLayer.push({
‘event‘: ‘virtualEvent’,
‘category‘: ‘Login’,
‘action‘: ‘Login satisfactorio’,
‘label‘: ‘(not available)’
});
3. Google Tag Manager: Acciones en el Home
3.1 Slider Principal – Impresión de Banners
Cuando un usuario visualiza un banner en el slider principal, se ejecutará el siguiente evento:
dataLayer.push({
‘event’: ‘promotionImpression’,
‘ecommerce’: {
‘promoView’: {
‘promotions’: [
{
‘id’: ‘{id_banner}‘,
‘name’: ‘{nombre_banner}’,
‘position’: ‘Home – Slider Header {posición_banner}’,
‘creative’: ‘{link_banner}’
}]
}
}
});
Nota: Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación
| Variable | Descripción | Posibles Valores |
| id | Un identificador único para el banner o elemento publicitario. | Ejemplo: ● 2345 ● Etc. |
| name | Un nombre descriptivo sobre el contenido del banner. | Ejemplo: ● 15% de Descuento. ● Botas Calvin Klein. ● Zapato Dockers Niños |
| creative | Se enviará la URL en caso el banner redirija a una nueva página, de lo contrario se envía el valor (not available). | Ejemplo: ●https://www.urlempresa.com/ ● (not available) ● Etc. |
| position | Se debe enviar la posición relativa del banner. | Ejemplo: ● Home – Slider Header 1 ● Home – Slider Header 2 ● Etc. |
3.2. Slider principal – Clic en banners
Cuando el usuario realiza clic sobre un banner en el slider principal, se debe enviar el siguiente script (sólo en caso de que el banner sea clickeable)
dataLayer.push({
‘event’: ‘promotionClick’,
‘ecommerce’: {
‘promoClick’: {
‘promotions’: [
{
‘id’: ‘{id_banner}’,
‘name’: ‘{nombre_banner}‘,
‘position’: ‘Home – Slider Header {posición_banner}’,
‘creative’: ‘{link_banner}’
}]
}
}
});
Nota: Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación
| Variable | Descripción | Posibles Variables |
| id | Un identificador único para el banner o elemento publicitario. | Ejemplo: ● 2345 ● Etc. |
| name | Un nombre descriptivo sobre el contenido del banner | Ejemplo: ● 15% de Descuento ● Descubre tu color ● Etc. |
| creative | Se enviará la URL a donde dirige el banner. | Ejemplo: ●https://www.urlempresa.com/ ● Etc. |
| position | La sección y la posición relativa del banner. | Ejemplo: ● Home – Slider Header 1 ● Home – Slider Header 2 ● Etc. |
3.3. Oferta de la Semana – Impresión de Banners
Cuando un usuario visualiza un banner en ofertas de la semana, se ejecutará el siguiente evento:
dataLayer.push({
‘event’: ‘promotionImpression’,
‘ecommerce’: {
‘promoView’: {
‘promotions’: [
{
‘id’: ‘{id_banner}’,
‘name’: ‘{nombre_banner}‘,
‘position’: ‘Home – Oferta de la semana {posición_banner}‘,
‘creative’: ‘{link_banner}’
}]
}
}
});
Nota: Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación.
| Variable | Descripción | Posibles Valores |
| id | Un identificador único para el banner o elemento publicitario. | Ejemplo: ● 2345 ● Etc. |
| name | Un nombre descriptivo sobre el contenido del banner. | Ejemplo: ● Zapato Bata Gamuza. ● Botas Bata sport. ● Zapato Dockers Adulto Sport. |
| creative | Se enviará la URL en caso el banner redirija a una nueva página, de lo contrario se envía el valor (not available). | Ejemplo: ●https://www.urlempresa.com/ ● (not available) ● Etc. |
| position | Se debe enviar la posición relativa del banner. | Ejemplo: ● Home – Oferta de la semana 1 ● Home – Oferta de la semana 2 ● Etc. |
3.4. Oferta de la Semana – Clics de Banners
Cuando el usuario realiza clic sobre el banner, se debe enviar el siguiente script.
dataLayer.push({
‘event’: ‘promotionClick’,
‘ecommerce’: {
‘promoClick’: {
‘promotions’: [
{
‘id’: ‘{id_banner}’,
‘name’: ‘{nombre_banner}’,
‘position’: ‘Home – Oferta de la semana {posición_banner}’,
‘creative’: ‘{link_banner}‘
}]
}
}
});
Nota: Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación:
| Variable | Descripción | Posibles Valores |
| id | Un identificador único para el banner o elemento publicitario. | Ejemplo: ● 2345 ● Etc. |
| name | Un nombre descriptivo sobre el contenido del banner | Ejemplo: ● Zapato Dockers Mujer. ● Botas Zara Salón. ● Zapato Hombre Vereno |
| creative | Se enviará la URL a donde dirige el banner. | Ejemplo: ●https://www.urlempresa.com/ ● Etc. |
| position | La sección y la posición relativa del banner. | Ejemplo: ● Home – Oferta de la semana 1 ● Home – Oferta de la semana 2 ● Etc. |
3.5. Listas – Impresión de Productos
Cuando un usuario visualice los productos ubicados en el home, se ejecutará el siguiente evento.
Nota: Este evento debe enviarse sólo una vez y mostrar únicamente la sección que el usuario observa.
dataLayer.push({
‘event’: ‘productImpression’,
‘ecommerce’: {
‘currencyCode’: ‘{currency}’,
‘impressions’: [{
‘name’: ‘{nombre producto}’,
‘id’: ‘{id producto}’,
‘price’: ‘{precio producto}’,
‘brand’: ‘{Marca producto}’,
‘category’: ‘{categoria producto}’,
‘variant’: ‘{variante producto}‘,
‘list’: ‘Home – {sección – opción}’,
‘position’: {posición producto},
‘dimension1’: ‘{color}’,
‘dimension2’: ‘{Talla}’
},
{
‘name’: ‘{nombre producto 2}’,
‘id’: ‘{id producto 2}’,
‘price’: ‘{precio producto 2}’,
‘brand’: ‘{Marca producto 2}’,
‘category’: ‘{categoria producto 2}’,
‘variant’: ‘{variante producto 2}’,
‘list’: ‘Home – {sección – opción}’,
‘position’: {posición producto 2},
‘dimension1’: ‘{color}’,
‘dimension2’: ‘{Talla}’
}]
}
});
Nota: El script muestra solo dos productos a modo de ejemplo, pero se deben enviar todos los productos que visualice el usuario.
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
| Variable | Descripción | Valores |
| {currency} | Debe mostrar el código de la moneda según el país en el que se encuentra. | PEN para Peruvian Nuevo Sol Más detalles en: https://support.google.com/a nalytics/answer/6205902?hl= es |
| {sección – opción} | El valor de la variable se arma siguiendo la siguiente lógica {sección}: Hace referencia a la sección en la web donde se encuentra la lista de productos, en el Home tenemos las siguientes secciones: ● Carteras ● Oferta de Temporada {Opcion}:Esta variable enviara alguna característica de la sección donde se encuentra la lista de productos, en las diferentes secciones del home tenemos las siguientes opciones: ● Top ventas ● Nuevos productos ● Ofertas Finalmente se arma la lista con ambos valores {sección – opción}: | Home – {sección – opción} Ejemplos ● Home – Carteras – Top ventas ● Home – Carteras – Nuevos productos ● Home – Carteras – Ofertas ● Home – Oferta de temporada – Top ventas ● Home – Oferta de temporada – Nuevos productos ● Home – Oferta de temporada – Ofertas |
| {nombre producto} | Nombre descriptivo del producto | Ejemplo: ● CARTERA ANN D VIAN MAK-CJ02 ● CARTERA ANN D VIAN FIO-CS24 ● SANDALIAS VIALE DAYA-653B ● SANDALIAS VIALE RUF-1900 ● Etc. |
| {id producto} | ID único del producto | Ejemplo: ● 2345678 ● 0008764 ● Etc. |
| {precio producto} | Precio del producto | Se debe tener en cuenta que se debe mostrar el precio que aparece en la página ya sea oferta o precio estándar, además el formato que debe tener es punto “.” Para los decimales, no se debe incluir símbolo para los miles, por Ejemplo: ● 78 ● 78.5 ● 78.99 ● 1576 ● 1576.00 ● 1576.99 Este formato es sólo para el envío del script, no debe afectar al formato que se muestra en la página (Front end). |
| {Marca producto} | Marca a la que pertenece el producto | Ejemplo: ● Viale ● ADV ● Etc. |
| {categoría producto} | Categoría a la que pertenece el producto | ● Sandalias ● Zapatos ● Zapatillas ● Carteras ● Etc. |
| {variante producto} | Variante del producto. | ● Damas ● Caballeros ● Kids ● Accesorios |
| {posición producto} | Posición en la que se encuentra el producto | Ejemplo: ●1 ●2 ●3 ● Etc. |
| {color} | Color del producto, en caso no se tenga algún color, se deberá enviar como valor: ● Estándar | Ejemplo: ● Negro ● Marrón ● Dorado ● Estándar ● Etc. |
| {Talla} | Talla seleccionada del producto, en caso no tenga alguna talla seleccionada se deberá enviar como valor: ● Estándar | Ejemplo: ● 34 ● 32 ● 28 ● Estándar ● Etc. |
3.6. Listas – Clic en Productos
Cuando el usuario selecciona alguno de los productos en el Home, se debe enviar el siguiente script.
dataLayer.push({
‘event’: ‘productClick’,
‘ecommerce’: {
‘click’: {
‘actionField’: {‘list’: ‘Home – {sección – opción}’},
‘products’: [{
‘name’: ‘{nombre producto}’,
‘id’: ‘{id producto}’,
‘price’: ‘{precio producto}’,
‘brand’: ‘{Marca producto}’,
‘category’: ‘{categoria producto}’,
‘variant’: ‘{variante del producto}‘,
‘position’: {posición producto},
‘dimension1’: ‘{color}’,
‘dimension2’: ‘{Talla}’
}]
}
}
});
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
| Variable | Descripción | Valores |
| {sección – opción} | El valor de la variable se arma siguiendo la siguiente lógica {sección}: Hace referencia a la sección en la web donde se encuentra la lista de productos, en el Home tenemos las siguientes secciones: ● Carteras ● Oferta de Temporada {Opcion}: Esta variable enviara alguna característica de la sección donde se encuentra la lista de productos, en las diferentes secciones del home tenemos las siguientes opciones: ● Top ventas ● Nuevos productos ● Ofertas Finalmente se arma la lista con ambos valores {sección – opción} | Home – { sección – opción} Ejemplos ● Home – Carteras – Top ventas ● Home – Carteras – Nuevos productos ● Home – Carteras – Ofertas ● Home – Oferta de temporada – Top ventas ● Home – Oferta de temporada – Nuevos productos ● Home – Oferta de temporada – Ofertas |
| {nombre producto} | Nombre descriptivo del producto | Ejemplo: ● CARTERA ANN D VIAN MAK-CJ02 ● CARTERA ANN D VIAN FIO-CS24 ● SANDALIAS VIALE DAYA-653B ● SANDALIAS VIALE RUF-1900 ● Etc. |
| {id producto} | ID único del producto | Ejemplo: ● 2345678 ● 0008764 ● Etc. |
| {id producto} | ID único del producto | Ejemplo: ● 2345678 ● 0008764 ● Etc. |
| {precio producto} | Precio del producto | Se debe tener en cuenta que se debe mostrar el precio que aparece en la página ya sea oferta o precio estándar, además el formato que debe tener es punto “.” Para los decimales, no se debe incluir símbolo para los miles, por Ejemplo: ● 78 ● 78.5 ● 78.99 ● 1576 ● 1576.00 ● 1576.99 Este formato es sólo para el envío del script, no debe afectar al formato que se muestra en la página (Front end). |
| {Marca producto} | Marca del producto | Ejemplo: ● Viale ● ADV ● Etc. |
| {categoría producto} | Categoría a la que pertenece el producto | ● Sandalias ● Zapatos ● Zapatillas ● Carteras ● Etc. |
| {variante producto} | Variante del producto. | ● Damas ● Caballeros ● Kids ● Accesorios |
| {posición producto} | Posición en la que se encuentra el producto | Ejemplo: ●1 ●2 ●3 ● Etc. |
| {color} | Color del producto, en caso no se tenga algún color, se deberá enviar como valor: ● Estándar | Ejemplo: ● Negro ● Marrón ● Dorado ● Estándar ● Etc. |
| {Talla} | Talla seleccionada del producto, en caso no tenga alguna talla seleccionada se deberá enviar como valor: ● Estándar | Ejemplo: ● 34 ● 32 ● 28 ● Estándar ● Etc. |
3.7. Productos Destacados – Impresión de Productos
Cuando un usuario visualice el pop-up de un producto “destacado” en el home, se ejecutará el siguiente evento.
Nota: Este evento debe enviarse sólo una vez y mostrar únicamente la sección que el usuario observa.
dataLayer.push({
‘event’: ‘productImpression’,
‘ecommerce’: {
‘currencyCode’: ‘{currency}’,
‘impressions’: [{
‘name’: ‘{nombre producto}’,
‘id’: ‘{id producto}’,
‘price’: ‘{precio producto}’,
‘brand’: ‘{Marca producto}’,
‘category’: ‘{categoria producto}’,
‘variant’: ‘{variante producto}’,
‘list’: ‘Home – Producto destacado’,
‘position’: {posición producto},
‘dimension1’: ‘{color}’,
’dimension2’: ‘{Talla}’
}]
}
});
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
| Variable | Descripción | Valores |
| {currency} | Debe mostrar el código de la moneda según el país en el que se encuentra. | PEN para Peruvian Nuevo Sol Más detalles en: https://support.google.com/a nalytics/answer/6205902?hl= es |
| {nombre producto} | Nombre descriptivo del producto | Ejemplo: ● CARTERA ANN D VIAN MAK-CJ02 ● CARTERA ANN D VIAN FIO-CS24 ● SANDALIAS VIALE DAYA-653B ● SANDALIAS VIALE RUF-1900 ● Etc. |
| {id producto} | ID único del producto | Ejemplo: ● 2345678 ● 0008764 ● Etc. |
| {precio producto} | Precio del producto | Se debe tener en cuenta que se debe mostrar el precio que aparece en la página ya sea oferta o precio estándar, además el formato que debe tener es punto “.” Para los decimales, no se debe incluir símbolo para los miles, por Ejemplo: ● 78 ● 78.5 ● 78.99 ● 1576 ● 1576.00 ● 1576.99 Este formato es solo para el envío del script, no debe afectar al formato que se muestra en la página (Front end). |
| {Marca producto} | Marca del producto | Ejemplo: ● Viale ● ADV ● Etc. |
| {categoría producto} | Categoría a la que pertenece el producto | ● Sandalias ● Zapatos ● Zapatillas ● Carteras ● Etc. |
| {variante producto} | Variante del producto. | ● Damas ● Caballeros ● Kids ● Accesorios |
| {posición producto} | Posición en la que se encuentra el producto | Ejemplo: ●1 ●2 ●3 ● Etc. |
| {color} | Color del producto, en caso no se tenga algún color, se deberá enviar como valor: ● Estándar | Ejemplo: ● Negro ● Marrón ● Dorado ● Estándar ● Etc. |
| {Talla} | Talla seleccionada del producto, en caso no tenga alguna talla seleccionada se deberá enviar como valor: ● Estándar | Ejemplo: ● 34 ● 32 ● 28 ● Estándar ● Etc. |
3.8. Productos Destacados – Clics en Productos
Cuando un usuario seleccione el producto “destacado” dentro del pop-up, en el home, se ejecutará el siguiente evento.
dataLayer.push({
‘event’: ‘productClick’,
‘ecommerce’: { ‘click’: {
‘actionField’: {‘list’: ‘Home – Producto destacado’},
‘products’: [{
‘name’: ‘{nombre producto}’,
‘id’: ‘{id producto}’,
‘price’: ‘{precio producto}’,
‘brand’: ‘{Marca producto}’,
‘category’: ‘{categoría producto}’,
‘variant’: ‘{variante del producto}’,
‘position’: {posición producto},
‘dimension1’: ‘{color}’,
‘dimension2’: ‘{Talla}’
}]
}
}
});
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
| Variable | Descripción | Valores |
| {nombre producto} | Nombre descriptivo del producto. | Ejemplo: ● CARTERA ANN D VIAN MAK-CJ02 ● CARTERA ANN D VIAN FIO-CS24 ● SANDALIAS VIALE DAYA-653B ● SANDALIAS VIALE RUF-1900 ● Etc. |
| {id producto} | ID único del producto | Ejemplo: ● 2345678 ● 0008764 ● Etc. |
| {precio producto} | Precio del producto | Se debe tener en cuenta que se debe mostrar el precio que aparece en la página ya sea oferta o precio estándar, además el formato que debe tener es punto “.” Para los decimales, no se debe incluir símbolo para los miles, por Ejemplo: ● 78 ● 78.5 ● 78.99 ● 1576 ● 1576.00 ● 1576.99 Este formato es sólo para el envío del script, no debe afectar al formato que se muestra en la página (Front end). |
| {Marca producto} | Marca del producto | Ejemplo: ● Viale ● ADV ● Etc. |
| {categoría producto} | Categoría a la que pertenece el producto | ● Sandalias ● Zapatos ● Zapatillas ● Carteras ● Etc. |
| {variante producto} | Variante del producto. | ● Damas ● Caballeros ● Kids ● Accesorios |
| {posición producto} | Posición en la que se encuentra el producto | Ejemplo: ●1 ●2 ●3 ● Etc. |
| {color} | Color del producto, en caso no se tenga algún color, se deberá enviar como valor: ● Estándar | Ejemplo: ● Negro ● Marrón ● Dorado ● Estándar ● Etc. |
| {Talla} | Talla seleccionada del producto, en caso no tenga alguna talla seleccionada se deberá enviar como valor: ● Estándar | Ejemplo: ● 34 ● 32 ● 28 ● Estándar ● Etc. |
4. Google Tag Manager: Variantes y Categorías de Productos
4.1. Impresión de Productos
Cuando un usuario visualice el listado de productos dentro de la variante (Damas, Caballeros, Kids, Accesorios) o dentro de una categoría (Sandalias, Zapato, Mocasines, etc.), se ejecutará el siguiente evento.
Nota: Este evento debe enviarse sólo una vez y mostrar únicamente la sección que el usuario observa.
Nota: El script muestra solo 2 productos a modo de ejemplo, pero se deben enviar todos los productos que visualice el usuario.
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
4.2. Clic en Productos
Cuando un usuario realice clic en algún producto del listado de productos dentro de la variante (Damas, Caballeros, Kids, Accesorios) o dentro de una categoría (Sandalias, Zapato, Mocasines, etc.), se ejecutará el siguiente evento.
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
5. Google Tag Manager: Ficha de Producto
5.1. Detalle de Producto
Cuando un usuario visualice la ficha del producto, se ejecutará el siguiente evento.
Nota: Este evento también se debe enviarse con el pop up ficha producto.
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
5.2. Impresión de Productos Relacionados
Cuando un usuario visualice los productos en la sección “Productos Relacionados”, en la ficha de producto, se ejecutará el siguiente evento.
Nota: Este evento debe enviarse sólo una vez y mostrar únicamente la sección que el usuario observa.
Nota: El script muestra solo dos productos a modo de ejemplo, pero se deben enviar todos los productos que visualice el usuario.
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
5.3. Clic en productos relacionados
Cuando el usuario selecciona alguno de los productos relacionados, se debe enviar el siguiente script.
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
6. Google Tag Manager: Bolsa de Compra
6.1. Agregar a la Bolsa
Cuando un usuario agrega un alguno de los productos a la bolsa de compras, se ejecutará el siguiente evento.
Nota: El evento también se puede ejecutar ingresando desde vista rápida.
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
6.2. Retirar de la Bolsa
Cuando un usuario retira alguno de los productos de la bolsa de compras, se ejecutará el siguiente evento.
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
6.3. Selección Botones
Cuando un usuario selecciona algunos de los botones presentes en la bolsa de compra, se ejecutará el siguiente evento.
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
7. Google Tag Manager: Proceso de Compra
7.1 Checkout – Paso 1
Cuando un usuario visualice el checkout del proceso de compra, se ejecutará el siguiente evento.
Nota: El script muestra solo un producto a modo de ejemplo; sin embargo, en el arreglo se deben enviar todos los productos que esté comprando el usuario.
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
7.2 Checkout – Paso 2
Cuando un usuario visualice el segundo pasos del checkout, se ejecutará el siguiente evento.
Nota: El script muestra solo un producto a modo de ejemplo; sin embargo, en el arreglo se deben enviar todos los productos que esté comprando el usuario.
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
7.3 Compra Satisfactoria
Cuando se realice un pago satisfactorio (página de gracias), se ejecutará el siguiente evento.
Nota: El script muestra solo un producto a modo de ejemplo; sin embargo, en el arreglo se deben enviar todos los productos que esté comprando el usuario.
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
7.4 Selección Realizar Pedido
Cuando un usuario selecciona la opción realizar pedido, se ejecutará el siguiente evento.
7.5 Selección Pagar
Cuando un usuario selecciona la opción pagar, se ejecutará el siguiente evento.
7.6 Confirmación de la Compra
Cuando un usuario realiza satisfactoriamente la compra (página de gracias), se ejecutará el siguiente evento.
8. Google Tag Manager: Interacciones
8.1. Menú
Cuando un usuario selecciona algunos de las opciones del menú superior, se ejecutará el siguiente evento.
Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación.
8.2. Suscripción
Cuando un usuario se suscribe satisfactoriamente, se ejecutará el siguiente evento.
8.3. Filtros
Cuando el usuario selecciona alguno de los filtros dentro de un listado de productos, se debe enviar el siguiente script.
Nota: Deberá enviarse un script por cada filtro seleccionado
Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación.
8.4. Contacto
Cuando el usuario selecciona la opción de contacto por Whatsapp, se debe enviar el siguiente script.
8.5. Lista de Deseos
Cuando el usuario selecciona la opción añadir/eliminar deseo, se debe enviar el siguiente script.
Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación.
8.6. Comparador
Cuando el usuario selecciona la opción añadir/eliminar deseo, se debe enviar el siguiente script.
Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación.
8.7. Vista Rápida
Cuando el usuario selecciona la opción vista rápida, se debe enviar el siguiente script.
Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación.
8.8. Vista Rápida – Producto
Cuando el usuario visualiza el producto desde vista rápida, se debe enviar el siguiente script.
Los valores resaltados en rojo, son datos dinámicos. Estos deberán ser modificados según la tabla que se muestra a continuación.
8.9. Ordenar por
Cuando el usuario selecciona la opción ordenar por, se debe enviar el siguiente script.
Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación.
8.10. Compartir
Cuando el usuario selecciona la opción ordenar por, se debe enviar el siguiente script.
Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación.
9. Google Tag Manager: Blog
9.1. Impresión de Notas
Cuando un usuario visualiza una nota en la sección del blog , se ejecutará el siguiente evento.
Nota: Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación.
9.2. Clic en Notas
Cuando el usuario realiza clic sobre una nota en la sección del blog, se debe enviar el siguiente script.
Nota: Los valores enmarcados en llaves y resaltados en rojo deberán ser reemplazados con los valores que se muestran a continuación