Ecommerce Mejorado: Guía Paso a Paso. Parte 2

08. marzo 2017 Google Analytics 0
Ecommerce Mejorado: Guía Paso a Paso. Parte 2
Ecommerce Mejorado: Guía Paso a Paso. Parte 2
5 (100%) 1 vote

Ecommerce Mejorado: Interacciones con productos

Listo. Una vez que hemos comprendido las transacciones con el Enhanced Ecommerce, debemos implementar la interacción que nos ofrece Google Analytics para los productos. En los siguientes scripts explicare cómo se puede medir el ciclo de vida de comercio electrónico para un solo producto así como la visualización de la ficha técnica, para finalizar el post con las interacciones para agregar y remover del carrito de compra.

Impresiones de la lista de productos

En este punto es importante identificar que es un listado de producto, el cual se refiere a una lista o colección a la que pertenece el producto (por ejemplo, Resultados de búsqueda)

listado de producto

  • En este punto debemos definir nosotros los diferentes listados en los cuales se puede imprimir los productos, ya nos permitirá obtener un mejor análisis y saber en que ubicación tiene mejor desempeño un producto y de igual forma podremos definirlos claramente para el programador que nos ayude a implementar el script.

Script para impresión de productos.

A Los detalles del producto son provistos por el objeto  impressionFieldObject, utilizando el comando addImpression, en donde las variables que son obligatorias son name (nombre del producto) así como el id ( sku del producto en su version anterior).

ga('create', 'UA-XXXXXXx-Y', 'midominio.com');
ga('require', 'ec');

ga('ec:addImpression', {
  'id': 'P12345',  // Los detalles del producto son provistos por el objeto =  impressionFieldObject.
  'name': 'Android Warhol T-Shirt',
  'category': 'Apparel/T-Shirts',
  'brand': 'Google',
  'variant': 'black',
  'list': 'Search Results',
  'position': 1   // 'position' indica la posición dentro de la lista de producto. 
});

ga('ec:addImpression', {
  'id': 'P67890',
  'name': 'YouTube Organic T-Shirt',
  'category': 'Apparel/T-Shirts',
  'brand': 'YouTube',
  'variant': 'gray',
  'list': 'Search Results',
  'position': 2
});

ga('send', 'pageview'); // envía el la impresión de producto con el hit pageview.

Nota: Debemos tener en cuenta la propiedad position la cual indica en que lugar se imprime el producto dentro del listado o array de productos

 

Clicks de producto productos

Una vez medido el numero de veces que un producto es impreso a través de una lista de producto, podremos medir también el clic de los mismos para poder obtener un CTR (click through rate) y poder identificar en que ubicación tiene un mejor desempeño cada uno de nuestro productos

clic de producto

Para medir el producto haremos uso nuevamente del comando ec:addProduct el cual nos permitirá enviar la interacción de los productos a través de las páginas y en  el caso del clic haremos uso del comando ec:setAction, especificando el tipo de valor clic así como una nueva propiedad dentro del objeto para la lista.

El script sería el siguiente:

// Debemos llamar esta funcion cuando el link del producto es activado 
function onProductClick() {
  ga('ec:addProduct', {
    'id': 'P12345',   // SKU
    'name': 'Android Warhol T-Shirt', // nombre del producto
    'category': 'Apparel',  // categoría 
    'brand': 'Youtube',   // Marca
    'variant': '', // Color, tamaño y es opcional 
    'position': 1  // posicion dentro de la lista 
  });
  ga('ec:setAction', 'click', {list: 'Search Results'});

  // Podremos imprimir un evento de Google Analytics para medir el click del producto
  ga('send', 'event', 'Ecommerce Mejorado', 'Product Click', 'Lista = Resultados de búsqueda', {
    hitCallback: function() {
      document.location = '/product_details?id=P12345';
    }
  });
}

 

Una vez hecho esto en el enlace del producto debe ir editado de la siguiente manera:

<a href="/next-page.html"
   onclick="onProductClick(); return !ga.loaded;">Android Warhol T-Shirt</a>

Ejemplo

Ecommerce mejorado click producto

 

Detalle de Producto

Ya tenemos el numero de veces que se imprimen mis productos en un listado así como el clic de cada uno de ellos.  Ahora será importante medir cuantas veces se los usuarios visualizan  la ficha de detalle de producto

Para medir el detalle de producto se utiliza nuevamente ec:addProducto  en conjunto con el comando setAction, especificando la accion:  detail.   * haciendo referencia a que estamos en la página de detalle de producto.

 

ga('create', 'UA-XXXXX-Y','midominio.com');
ga('require', 'ec');

ga('ec:addProduct', {
  'id': 'P12345',
  'name': 'YouTube Leatherette Notebook Combo',
  'category': 'Office',
  'brand': 'youtube',
  'variant': 'red'
});

ga('ec:setAction', 'detail');

ga('send', 'pageview');

 

Una vez logrando esto  Google Analytics nos podría proporcionar otras 2 métricas mas que nos permitirá analizar mejor el desempeño de nuestros productos:

  • Porcentaje carrito/detalle : Número veces que un producto se agrega al carrito divididas entre el número de veces que se visualizan la pagina de detalle de producto
  • Porcentaje compra/detalle : Compas únicas divididas entre el número de veces que se visualizan la pagina de detalle de producto

 

detalle de producto

 

Interacciones con Agregar y remover del Carrito

Anteriormente podríamos medirlo por medio de eventos en Google Analytics, para medirlo a través del ecommerce mejorado  haremos uso del método addProdcuto como lo hemos manejado para enviar el producto a través de múltiples interacciones como ya lo hemos visto.

 

Para medir cuando un producto es agregado o removido del carrito de compra haremos uso de una función addOrRemoveCart la cual tiene como argumento el producto dentro de la cual llamamos al método addProduct y dentro de un objeto de JS incluimos  las propiedades del producto que pasamos, para  finalmente con comando setAction especificaremos el  tipo de interacción. “add” o “remove” según sea el caso.

// Debemos llamar esta función cuando el producto es agregado al carrito .

function addOrRemoveCart(product) {
 ga('ec:addProduct', {
 'id': product.id,
 'name': product.name,
 'category': product.category,
 'brand': product.brand,
 'variant': product.variant,
 'price': product.price,
 'quantity': product.qty
 });
 ga('ec:setAction', 'add'); // podemos establecer remove en el caso de que sea remover del carrito

 ga('send', 'event', 'Enhanced Ecommerce', 'Add to Cart', 'Nombre del Producto'); // Enviamos un evento a traves de google Analytics 

}

Una vez lo grado esto ya podremos visualizar la información de los productos dentro de nuestros reportes de Google Analytics.

 

Ecommerce Mejorado Add to cart

Conclusion:

  • En los scripts hemos incluido eventos de google Analytics para mostrarte como podremos generar segmentos avanzados o bien listas de remarketing de acuerdo a esta interacción.
  • Si deseas implementar el Enhance ecommerce por medio de Google Analytics ten en cuenta del método addProduct ya que es importante para medir las interacciones a lo largo de la pagina hasta la transacción.

 

Como siempre espero sea de utilidad este pequeño tutorial o bien siéntete libre de enviar tus comentarios o dudas que en breve las responderé  y te invito a revisar la 3a etapa de como medir  de promociones en Google Analytics en el siguiente apartado.

Resumen
Ecommerce Mejorado: Interacciones de productos. Guia paso 2
Nombre del Articulo
Ecommerce Mejorado: Interacciones de productos. Guia paso 2
Descripción
Entra y aprende como implementar el ecommerce mejorado con Google Analytics. Una explicación de cada script de la interacción con productos
Autor

Deja un comentario