Seguimiento de comercio electrónico

En esta guía se describe cómo recopilar los datos de comercio electrónico con analytics.js.

Descripción general

Con el seguimiento del comercio electrónico puedes medir el número de transacciones y los ingresos que genera tu sitio web. En un sitio de comercio electrónico estándar, cuando un usuario hace clic en el botón para comprar del navegador, la información de compra del usuario se envía al servidor web, que lleva a cabo la transacción. Si se realiza correctamente, el servidor redirecciona al usuario a una página de agradecimiento o de emisión de recibo con los detalles de la transacción y un recibo de la compra. Puedes usar la biblioteca analytics.js para enviar los datos de comercio electrónico procedentes de la página de agradecimiento a Google Analytics.

Existen dos tipos de datos de comercio electrónico que puedes enviar mediante analytics.js: datos de transacciones y de artículos.

Datos de transacciones

Una transacción representa la transacción completa que se produce en el sitio y contiene los siguientes valores:

Clave Tipo de valor Obligatorio Descripción
id texto Indica el ID de la transacción (p. ej., 1234).
affiliation texto No Indica la tienda o la afiliación en la que se ha producido la transacción (p. ej., Nike Store).
revenue moneda No Especifica los ingresos totales o la suma total asociados a la transacción (por ejemplo, 11,99). Este valor puede incluir los gastos de envío, los impuestos u otros ajustes de los ingresos totales que quieras incluir para calcular tus ingresos.
shipping moneda No Especifica el total de los gastos de envío de la transacción (p. ej., 5).
tax moneda No Especifica el total de los impuestos de la transacción (por ejemplo, 1,29).

Datos de artículos

Un artículo representa los productos individuales que hay en el carrito de la compra y contiene los siguientes valores:

Clave Tipo de valor Obligatorio Descripción
id texto Especifica el ID de la transacción. Este ID representa los enlaces a las transacciones a las que pertenecen los artículos (p. ej., 1234).
name texto Indica el nombre del artículo (p. ej., "Ositos de peluche").
sku texto No Especifica el código SKU o de artículo (p. ej., SKU47).
category texto No Indica la categoría a la que pertenece el artículo (p. ej., "Peluches").
price moneda No Indica el precio unitario de cada artículo (p. ej., 11,99).
quantity entero No Indica el número de unidades compradas en la transacción. Si el valor de este campo es un número decimal (por ejemplo, 1.5), se redondeará al valor entero más próximo.

Implementación

Normalmente, el seguimiento de comercio electrónico se implementa después de que el usuario haya realizado el proceso de pago. Se suele producir en la página de agradecimiento por la compra. Cuando lo hayas implementado y ya estés preparado para enviar los datos de comercio electrónico a Google Analytics, hay una serie de pasos que debes llevar a cabo:

Cargar el plugin de comercio electrónico

Para reducir el tamaño de la biblioteca analytics.js, el seguimiento de comercio electrónico no se incluye en la biblioteca predeterminada. Se ofrece como un módulo de plugin que se debe cargar antes de usarse.

Para cargar el plugin de comercio electrónico, usa este comando:

ga('require', 'ecommerce');

El comando se debe indicar después de crear el objeto de seguimiento y antes de usar la función específica de comercio electrónico.

Después de cargarse, se agregará una serie de nuevos comandos específicos del seguimiento de comercio electrónico al objeto de seguimiento predeterminado.

Agregar una transacción

Después de haber cargado el plugin, se crea un objeto transparente de carrito de la compra. Puedes agregar los datos de transacciones y de artículos al carrito de la compra y, una vez configurados por completo, se envían todos a la vez.

Los datos de transacciones se agregan al carrito de la compra con el comando ecommerce:addTransaction:

ga('ecommerce:addTransaction', {
  'id': '1234',                     // Transaction ID. Required.
  'affiliation': 'Acme Clothing',   // Affiliation or store name.
  'revenue': '11.99',               // Grand Total.
  'shipping': '5',                  // Shipping.
  'tax': '1.29'                     // Tax.
});

Agregar artículos

Después, para agregar artículos al carrito de la compra, se usa el comando ecommerce:addItem:

ga('ecommerce:addItem', {
  'id': '1234',                     // Transaction ID. Required.
  'name': 'Fluffy Pink Bunnies',    // Product name. Required.
  'sku': 'DD23444',                 // SKU/code.
  'category': 'Party Toys',         // Category or variation.
  'price': '11.99',                 // Unit price.
  'quantity': '1'                   // Quantity.
});

Enviar datos

Por último, una vez configurados todos los datos de comercio electrónico en el carrito de la compra, se envían a Google Analytics con el comando ecommerce:send:

ga('ecommerce:send');

Con este comando se recorrerá cada transacción y artículo del carrito de la compra y se enviarán los datos correspondientes a Google Analytics. Una vez terminada esta operación, se borran los datos del carrito de la compra y ya se pueden enviar los datos de una nueva transacción. Si se había emitido un comando ecommerce:send anteriormente, solo se enviarán los datos de nuevas transacciones y artículos.

Borrar datos

Si tienes que borrar manualmente todas las transacciones y los artículos del carrito de la compra, debes usar el comando siguiente:

ga('ecommerce:clear');

Especificación de las monedas locales

De forma predeterminada, puedes configurar una moneda común y global para todas las transacciones y artículos a través de la interfaz web de administración de Google Analytics. La moneda global se usa de manera predeterminada para todos los artículos y transacciones. En el caso de los sitios web en los que se llevan a cabo transacciones en varias monedas, el plugin de comercio electrónico permite especificar la moneda local de la transacción así como de los productos individuales.

La moneda local se debe especificar según la norma ISO 4217. Consulta en el documento Referencia de los códigos de moneda la lista completa de las monedas de conversión que se admiten.

Para establecer la moneda local de una determinada transacción y todos sus artículos, solo debes especificar el valor de currency para la transacción:

ga('ecommerce:addTransaction', {
  'id': '1234',
  'affiliation': 'Acme Clothing',
  'revenue': '11.99',
  'shipping': '5',
  'tax': '1.29',
  'currency': 'EUR'  // local currency code.
});

Por último, también puedes especificar el valor de currency para el artículo:

  ga('ecommerce:addItem', {
    'id': '1234',
    'name': 'Fluffy Pink Bunnies',
    'sku': 'DD23444',
    'category': 'Party Toys',
    'price': '11.99',
    'quantity': '1',
    'currency': 'GBP' // local currency code.
  });

Compatibilidad con varios objetos de seguimiento

También puedes usar el plugin de comercio electrónico si has implementado varios objetos de seguimiento (con nombre) en tu página. El plugin funciona igual que el objeto de seguimiento predeterminado, con la excepción de que el formato es: nombreDeObjetoDeSeguimiento.nombreDePlugin:método. Por ejemplo, si has creado un objeto de seguimiento denominado myTracker:

ga('create', 'UA-XXXXX-Y', 'auto', {'name': 'myTracker'});

Después, se carga el plugin de comercio electrónico del objeto de seguimiento con nombre mediante:

ga('myTracker.require', 'ecommerce');

Para enviar una transacción, puedes crear un objeto de transacción y transmitirlo al objeto de seguimiento con nombre del siguiente modo:

var transaction = {
  'id': '1234',                    // Transaction ID.
  'affiliation': 'Acme Clothing',  // Affiliation or store name.
  'revenue': '11.99',              // Grand Total.
  'shipping': '5' ,                // Shipping.
  'tax': '1.29'                    // Tax.
};

ga('myTracker.ecommerce:addTransaction', transaction);

Con esta sintaxis, el objeto de transacción se puede usar en varios sistemas de seguimiento.

Por último, los datos de seguimiento se envían del siguiente modo:

ga('myTracker.ecommerce:send');

Ejemplo

La mayoría de los sitios de comercio electrónico realizan las transacciones en el servidor, mientras que la biblioteca analytics.js envía los datos a Google Analytics desde el navegador. Por consiguiente, es necesario que haya cierta coordinación entre el servidor y el cliente para que los datos de comercio electrónico se envíen correctamente a Google Analytics.

La mayoría de los sitios de comercio electrónico procesan la página de agradecimiento por la compra con un motor de creación de plantillas en el servidor. En este caso, se agrega el código de seguimiento de comercio electrónico a la plantilla en el servidor y se usa la lógica del servidor para escribir dinámicamente los valores de datos de comercio electrónico en la página final. A continuación, te presentamos un ejemplo de su aspecto en PHP.

En PHP, normalmente se tiene algún tipo de representación de los datos de comercio electrónico. En este ejemplo, los datos están almacenados en una matriz asociativa:

<?php
// Transaction Data
$trans = array('id'=>'1234', 'affiliation'=>'Acme Clothing',
               'revenue'=>'11.99', 'shipping'=>'5', 'tax'=>'1.29');

// List of Items Purchased.
$items = array(
  array('sku'=>'SDFSDF', 'name'=>'Shoes', 'category'=>'Footwear', 'price'=>'100', 'quantity'=>'1'),
  array('sku'=>'123DSW', 'name'=>'Sandals', 'category'=>'Footwear', 'price'=>'87', 'quantity'=>'1'),
  array('sku'=>'UHDF93', 'name'=>'Socks', 'category'=>'Footwear', 'price'=>'5.99', 'quantity'=>'2')
);
?>

El primer paso es escribir la lógica para transformar los datos de comercio electrónico en la cadena JavaScript que requiere analytics.js:

<?php
// Function to return the JavaScript representation of a TransactionData object.
function getTransactionJs(&$trans) {
  return <<<HTML
ga('ecommerce:addTransaction', {
  'id': '{$trans['id']}',
  'affiliation': '{$trans['affiliation']}',
  'revenue': '{$trans['revenue']}',
  'shipping': '{$trans['shipping']}',
  'tax': '{$trans['tax']}'
});
HTML;
}

// Function to return the JavaScript representation of an ItemData object.
function getItemJs(&$transId, &$item) {
  return <<<HTML
ga('ecommerce:addItem', {
  'id': '$transId',
  'name': '{$item['name']}',
  'sku': '{$item['sku']}',
  'category': '{$item['category']}',
  'price': '{$item['price']}',
  'quantity': '{$item['quantity']}'
});
HTML;
}
?>

A continuación, en la etiqueta <script> se agrega la lógica PHP para crear dinámicamente la salida de los datos de transacciones y de artículos:

<!-- Begin HTML -->
<script>
ga('require', 'ecommerce');

<?php
echo getTransactionJs($trans);

foreach ($items as &$item) {
  echo getItemJs($trans['id'], $item);
}
?>

ga('ecommerce:send');
</script>

Después de que haya terminado la ejecución de la secuencia de comandos PHP, se imprimirán en la página los datos de transacciones y de artículos que requiere analytics.js. Una vez que el código JavaScript se procese en el navegador, se enviarán todos los datos de comercio electrónico a Google Analytics.

Tipos de moneda

El tipo de moneda predeterminada se puede configurar mediante la interfaz de administración. Cuando se envían valores de moneda con analytics.js, el valor representa el valor total de una moneda.

Se puede usar un punto como delimitador entre la parte entera y la decimal de la moneda. La precisión es de seis decimales como máximo. El siguiente valor es válido para un campo de moneda:

1000.000001

Cuando el valor se envía a Google Analytics, se elimina todo el texto hasta el primer dígito, el carácter - o el carácter . (decimal). Por lo tanto:

$-55.00

Se convierte en:

-55.00