Tooldata Academia
Lección 26 de 31•GA4 para E-commerce

Eventos de e-commerce: view_item, add_to_cart, purchase

Los eventos estándar de GA4 para tiendas online.

13 minutos

GA4 define un conjunto de eventos estandar para ecommerce que, cuando los implementas correctamente, desbloquean reportes especializados y analisis avanzado. En esta leccion dominaras cada evento, sus parametros y cuando usarlos.

Mapa del customer journey en GA4

Cada evento de ecommerce corresponde a una etapa del recorrido de compra:

DESCUBRIMIENTO          CONSIDERACION          DECISION           POST-COMPRA
     |                       |                    |                    |
view_item_list -----> view_item -----> add_to_cart -----> purchase -----> refund
     |                       |                    |
select_item            select_promotion    remove_from_cart
                                                 |
                                          begin_checkout
                                                 |
                                          add_shipping_info
                                                 |
                                          add_payment_info

Eventos de descubrimiento

view_item_list

Se dispara cuando el usuario ve una lista de productos (categoria, resultados de busqueda, productos relacionados).

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "view_item_list",
  ecommerce: {
    item_list_id: "categoria_electronica",
    item_list_name: "Electronica",
    items: [
      {
        item_id: "SKU_001",
        item_name: "Audifonos Bluetooth",
        item_brand: "SoundMax",
        item_category: "Electronica",
        item_category2: "Audio",
        item_list_id: "categoria_electronica",
        item_list_name: "Electronica",
        index: 0,
        price: 899.00
      },
      {
        item_id: "SKU_002",
        item_name: "Bocina Portatil",
        item_brand: "SoundMax",
        item_category: "Electronica",
        item_category2: "Audio",
        item_list_id: "categoria_electronica",
        item_list_name: "Electronica",
        index: 1,
        price: 1299.00
      }
      // Mas productos...
    ]
  }
});

Parametros clave:

Parametro Tipo Descripcion
item_list_id string ID unico de la lista
item_list_name string Nombre descriptivo de la lista
items array Productos visibles en pantalla
index number Posicion del producto en la lista (0-based)

Tip: No envies todos los productos de la pagina, solo los visibles en el viewport inicial. Para lazy loading, considera enviar eventos adicionales cuando nuevos productos se vuelven visibles.

select_item

Se dispara cuando el usuario hace clic en un producto de una lista.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "select_item",
  ecommerce: {
    item_list_id: "categoria_electronica",
    item_list_name: "Electronica",
    items: [{
      item_id: "SKU_001",
      item_name: "Audifonos Bluetooth",
      item_brand: "SoundMax",
      item_category: "Electronica",
      item_category2: "Audio",
      item_list_id: "categoria_electronica",
      item_list_name: "Electronica",
      index: 0,
      price: 899.00
    }]
  }
});

Este evento te permite analizar que productos de cada lista generan mas interes y correlacionar la posicion con los clics.

Eventos de consideracion

view_item

El evento mas importante de la fase de consideracion. Se dispara cuando el usuario ve la pagina de detalle de un producto.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "view_item",
  ecommerce: {
    currency: "MXN",
    value: 899.00,
    items: [{
      item_id: "SKU_001",
      item_name: "Audifonos Bluetooth Pro",
      item_brand: "SoundMax",
      item_category: "Electronica",
      item_category2: "Audio",
      item_category3: "Audifonos",
      item_variant: "Negro",
      price: 899.00,
      quantity: 1
    }]
  }
});

Parametros importantes:

Parametro Tipo Requerido Descripcion
currency string Si* Codigo ISO 4217 (MXN, USD, EUR)
value number Si* Valor total del producto visto
items array Si Array con el producto

*Requeridos para reportes de monetizacion.

view_promotion

Se dispara cuando el usuario ve un banner promocional o anuncio interno.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "view_promotion",
  ecommerce: {
    items: [{
      item_id: "SKU_001",
      item_name: "Audifonos Bluetooth",
      promotion_id: "PROMO_VERANO_2026",
      promotion_name: "Ofertas de Verano",
      creative_name: "banner_hero_home",
      creative_slot: "hero_principal",
      location_id: "home_banner_1"
    }]
  }
});

select_promotion

Se dispara cuando el usuario hace clic en una promocion.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "select_promotion",
  ecommerce: {
    items: [{
      item_id: "SKU_001",
      item_name: "Audifonos Bluetooth",
      promotion_id: "PROMO_VERANO_2026",
      promotion_name: "Ofertas de Verano",
      creative_name: "banner_hero_home",
      creative_slot: "hero_principal",
      location_id: "home_banner_1"
    }]
  }
});

Eventos del carrito

add_to_cart

Evento critico que indica intencion de compra. Se dispara cuando el usuario agrega un producto al carrito.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "add_to_cart",
  ecommerce: {
    currency: "MXN",
    value: 899.00,
    items: [{
      item_id: "SKU_001",
      item_name: "Audifonos Bluetooth Pro",
      item_brand: "SoundMax",
      item_category: "Electronica",
      item_category2: "Audio",
      item_variant: "Negro",
      price: 899.00,
      quantity: 1
    }]
  }
});

Consideraciones de implementacion:

// Funcion reutilizable para agregar al carrito
function trackAddToCart(producto, cantidadAgregada) {
  const valorTotal = producto.precio * cantidadAgregada;

  dataLayer.push({ ecommerce: null });
  dataLayer.push({
    event: "add_to_cart",
    ecommerce: {
      currency: "MXN",
      value: valorTotal,
      items: [{
        item_id: producto.sku,
        item_name: producto.nombre,
        item_brand: producto.marca,
        item_category: producto.categoria,
        item_variant: producto.variante,
        price: producto.precio,
        quantity: cantidadAgregada
      }]
    }
  });
}

// Uso
document.getElementById('btn-agregar').addEventListener('click', function() {
  const producto = obtenerDatosProducto();
  const cantidad = parseInt(document.getElementById('cantidad').value);
  trackAddToCart(producto, cantidad);
});

remove_from_cart

Se dispara cuando el usuario elimina un producto del carrito.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "remove_from_cart",
  ecommerce: {
    currency: "MXN",
    value: 899.00,
    items: [{
      item_id: "SKU_001",
      item_name: "Audifonos Bluetooth Pro",
      item_brand: "SoundMax",
      item_category: "Electronica",
      price: 899.00,
      quantity: 1
    }]
  }
});

Analisis: Comparar add_to_cart vs remove_from_cart por producto te revela cuales productos generan "arrepentimiento" de compra.

view_cart

Se dispara cuando el usuario ve la pagina del carrito.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "view_cart",
  ecommerce: {
    currency: "MXN",
    value: 2198.00,
    items: [
      {
        item_id: "SKU_001",
        item_name: "Audifonos Bluetooth Pro",
        price: 899.00,
        quantity: 1
      },
      {
        item_id: "SKU_003",
        item_name: "Cable USB-C",
        price: 299.00,
        quantity: 1
      }
    ]
  }
});

Eventos de checkout

begin_checkout

Marca el inicio del proceso de checkout. Se dispara cuando el usuario comienza el proceso de compra.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "begin_checkout",
  ecommerce: {
    currency: "MXN",
    value: 2198.00,
    coupon: "DESCUENTO10",
    items: [
      {
        item_id: "SKU_001",
        item_name: "Audifonos Bluetooth Pro",
        item_brand: "SoundMax",
        item_category: "Electronica",
        price: 899.00,
        quantity: 1
      },
      {
        item_id: "SKU_003",
        item_name: "Cable USB-C",
        item_brand: "TechCables",
        item_category: "Accesorios",
        price: 299.00,
        quantity: 1
      }
    ]
  }
});

add_shipping_info

Se dispara cuando el usuario selecciona o completa la informacion de envio.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "add_shipping_info",
  ecommerce: {
    currency: "MXN",
    value: 2198.00,
    coupon: "DESCUENTO10",
    shipping_tier: "Express",
    items: [
      {
        item_id: "SKU_001",
        item_name: "Audifonos Bluetooth Pro",
        price: 899.00,
        quantity: 1
      }
      // Resto de items...
    ]
  }
});

Parametro especial:

  • shipping_tier: Tipo de envio seleccionado (Express, Standard, Same Day, etc.)

add_payment_info

Se dispara cuando el usuario completa la informacion de pago.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "add_payment_info",
  ecommerce: {
    currency: "MXN",
    value: 2198.00,
    coupon: "DESCUENTO10",
    payment_type: "Tarjeta de Credito",
    items: [
      {
        item_id: "SKU_001",
        item_name: "Audifonos Bluetooth Pro",
        price: 899.00,
        quantity: 1
      }
      // Resto de items...
    ]
  }
});

Parametro especial:

  • payment_type: Metodo de pago seleccionado (Tarjeta de Credito, PayPal, Transferencia, etc.)

Privacidad: Nunca incluyas datos sensibles como numeros de tarjeta, CVV o tokens de pago en el dataLayer.

Evento de conversion: purchase

El evento mas importante de todo el tracking de ecommerce. Se dispara cuando la transaccion se completa exitosamente.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "purchase",
  ecommerce: {
    transaction_id: "TRX_20260129_001",
    value: 2348.00,
    tax: 375.68,
    shipping: 150.00,
    currency: "MXN",
    coupon: "DESCUENTO10",
    items: [
      {
        item_id: "SKU_001",
        item_name: "Audifonos Bluetooth Pro",
        item_brand: "SoundMax",
        item_category: "Electronica",
        item_category2: "Audio",
        item_variant: "Negro",
        coupon: "DESCUENTO10",
        discount: 89.90,
        price: 809.10,
        quantity: 1
      },
      {
        item_id: "SKU_003",
        item_name: "Cable USB-C Premium",
        item_brand: "TechCables",
        item_category: "Accesorios",
        price: 299.00,
        quantity: 1
      }
    ]
  }
});

Parametros de nivel transaccion:

Parametro Tipo Requerido Descripcion
transaction_id string Si ID unico de la transaccion
value number Si* Valor total de la compra
currency string Si* Codigo de moneda ISO 4217
tax number No Impuestos totales
shipping number No Costo de envio
coupon string No Cupon aplicado a nivel orden

Critico: El transaction_id debe ser unico para cada compra. Usar IDs duplicados causara que GA4 deduplique transacciones y pierdas datos.

Implementacion robusta del purchase

function trackPurchase(orden) {
  // Validar que tenemos datos minimos
  if (!orden.id || !orden.total || !orden.items?.length) {
    console.error('Datos de orden incompletos para tracking');
    return;
  }

  // Formatear items para GA4
  const itemsGA4 = orden.items.map((item, index) => ({
    item_id: item.sku,
    item_name: item.nombre,
    item_brand: item.marca || '',
    item_category: item.categoria || '',
    item_variant: item.variante || '',
    price: parseFloat(item.precio),
    quantity: parseInt(item.cantidad),
    discount: item.descuento ? parseFloat(item.descuento) : 0,
    coupon: item.cupon || ''
  }));

  dataLayer.push({ ecommerce: null });
  dataLayer.push({
    event: "purchase",
    ecommerce: {
      transaction_id: orden.id,
      value: parseFloat(orden.total),
      tax: parseFloat(orden.impuestos || 0),
      shipping: parseFloat(orden.envio || 0),
      currency: orden.moneda || "MXN",
      coupon: orden.cupon || '',
      items: itemsGA4
    }
  });

  console.log('Purchase tracked:', orden.id);
}

Evento post-compra: refund

Se dispara cuando se procesa una devolucion o reembolso.

Reembolso completo

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "refund",
  ecommerce: {
    transaction_id: "TRX_20260129_001",
    value: 2348.00,
    currency: "MXN"
    // No es necesario incluir items para reembolso completo
  }
});

Reembolso parcial

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "refund",
  ecommerce: {
    transaction_id: "TRX_20260129_001",
    value: 809.10,
    currency: "MXN",
    items: [{
      item_id: "SKU_001",
      item_name: "Audifonos Bluetooth Pro",
      price: 809.10,
      quantity: 1
    }]
  }
});

Tabla resumen de eventos

Evento Cuando dispararlo Parametros clave
view_item_list Usuario ve lista de productos item_list_id, item_list_name, items
select_item Usuario hace clic en producto de lista item_list_id, items (1)
view_item Usuario ve pagina de producto currency, value, items (1)
view_promotion Usuario ve banner/promocion promotion_id, promotion_name
select_promotion Usuario hace clic en promocion promotion_id, promotion_name
add_to_cart Usuario agrega al carrito currency, value, items
remove_from_cart Usuario elimina del carrito currency, value, items
view_cart Usuario ve pagina del carrito currency, value, items
begin_checkout Usuario inicia checkout currency, value, items
add_shipping_info Usuario completa envio shipping_tier, items
add_payment_info Usuario completa pago payment_type, items
purchase Transaccion completada transaction_id, value, items
refund Devolucion procesada transaction_id, value

Errores frecuentes a evitar

1. Price incorrecto en purchase

// MAL: precio sin descuento
items: [{
  item_id: "SKU_001",
  price: 899.00,  // precio original
  discount: 89.90,
  quantity: 1
}]

// BIEN: precio final pagado
items: [{
  item_id: "SKU_001",
  price: 809.10,  // precio despues de descuento
  discount: 89.90,
  quantity: 1
}]

2. Value no coincide con suma de items

// MAL: value no cuadra
{
  value: 2000.00,  // Valor incorrecto
  items: [
    { price: 899.00, quantity: 1 },  // 899
    { price: 299.00, quantity: 2 }   // 598
  ]                                   // Total: 1497, no 2000
}

// BIEN: value = suma de (price * quantity)
{
  value: 1497.00,
  items: [
    { price: 899.00, quantity: 1 },
    { price: 299.00, quantity: 2 }
  ]
}

3. Disparar purchase en pagina incorrecta

El evento purchase solo debe dispararse en la pagina de confirmacion de compra exitosa, NUNCA en:

  • Pagina de checkout
  • Pagina de procesamiento
  • Pagina de error de pago

Puntos clave de esta leccion

  • GA4 tiene eventos estandar para cada etapa del customer journey
  • transaction_id debe ser unico para evitar deduplicacion de compras
  • value debe ser el monto real pagado, incluyendo descuentos aplicados
  • Siempre incluye currency para habilitar reportes de monetizacion
  • El array items debe reflejar exactamente los productos involucrados en cada evento
  • Valida que la suma de items coincida con el value total

Proxima leccion

Exploraremos los reportes de ecommerce en GA4, donde veras como toda esta data se convierte en insights accionables sobre el rendimiento de tus productos y el proceso de compra.

Quiz de autoevaluacion

1. Cual evento marca el inicio oficial del proceso de checkout?

  • a) view_cart
  • b) add_to_cart
  • c) begin_checkout
  • d) add_shipping_info

2. Que parametro es obligatorio y unico en el evento purchase?

  • a) coupon
  • b) shipping
  • c) transaction_id
  • d) tax

3. Cuando se debe disparar el evento remove_from_cart?

  • a) Cuando el usuario cierra la pagina del carrito
  • b) Cuando el usuario elimina un producto del carrito
  • c) Cuando el carrito se vacia automaticamente
  • d) Cuando expira la sesion del usuario

4. En el evento purchase, el parametro "price" de cada item debe reflejar:

  • a) El precio original sin descuentos
  • b) El precio final pagado por el cliente
  • c) El precio de lista del catalogo
  • d) El precio promedio de venta

5. Cual es el proposito del parametro shipping_tier en add_shipping_info?

  • a) Indicar el costo de envio
  • b) Indicar el tipo de envio seleccionado
  • c) Indicar la direccion de envio
  • d) Indicar la fecha de entrega

Respuestas: 1-c, 2-c, 3-b, 4-b, 5-b

¿Completaste esta lección?

Marca esta lección como completada. Tu progreso se guardará en tu navegador.

Anterior
Configurar Enhanced Ecommerce en GA4
Siguiente
Reportes de e-commerce en GA4