Agrega analíticas

Esta página documenta cómo anadiañadir analíticas al widget de DEUNA.

📘

Descubre cómo incluir el poder de las Analíticas a tu widget

Rastrear compras con Google Tag Manager

Rastrea los eventos de compra de tus clientes a través de Google Tag Manager.

Integra el siguiente código a la configuración en la propiedad keyId de tu instancia DEUNA:

const deunaCheckout = window.DunaCheckout();

const config = {
    apiKey: "<tu clave API pública>",
    orderToken: "<token de la orden>",
    analytics: {
        googleTagManager: {
            keyId: "GTM-XXX-XX"
        }
    }
};

deunaCheckout.configure(config);

Atributos necesarios

AtributoValor por DefectoDescripciónRequerido
analyticsObjeto necesario para hacer seguimiento de cada orden.falseNo
googleTagManagerPropiedad requerida para la integración con Google Tag Manager.-No
keyIdIdentificador del contenedor proporcionado por Google Tag Manager, con formato "GTM-XXXXXX".-No

📘

Para más información sobre Google Tag Maganer, ve al Portal de desarrollador.

Acciones y eventos

El Checkout DEUNA emite eventos mediante las interacciones del usuario y las funciones internas.

Los eventos son nuestra forma de informar cuando una acción relevante sucede en tu checkout.

Cuando ocurre un evento, el Checkout crea un evento nuebo nombre único dentro de la función onEventDispatch.

📘

La función OnEventDispatch devuelve event y data continuamente.

Cuando se completa un pago:

  • Se crea un eventopurchasesi la orden se procesa correctamente.
  • Se crea un evento purchaseError si ocurre un error y se la orden no se procesa correctamente.

Diagrama de eventos

El siguiente diagrama muestra la secuencia de eventos emitidos por el Checkout durante el ciclo de compra:

2892

Recuperar un evento

La función OnEventDispatch devuelve event y data continuamente.

  • event corresponde al nombre del evento.
  • data corresponde a información útil en relación al evento.

El siguiente ejemplo redirige al usuario a una página después de emitir el evento purchase:

const config = {
  apiKey: "...",
  env: "production",
  orderToken: "...",
  onEventDispatch: function (event, data) {
    if (event === 'purchase') {
    	window.location.href="https://www.somepage.com/orderCompleted";
    }
  }
};