Saltar al contenido principal
Este artículo explica cómo ejecutar tests A/B conformes dentro del checkout de Shopify Plus utilizando experimentos web de Kameleoon, cart attributes de Shopify y Checkout UI Extensions.

​
Paso 1: Asignar una variación mediante un experimento web de Kameleoon

En la página del carrito, utilice Kameleoon para asignar una variación (por ejemplo, Variación A o Variación B) y persista la asignación en un cart attribute como kameleoon-checkout-variant. Esta asignación garantiza que el checkout pueda reaccionar a la variación. Utilice el siguiente código JavaScript para asignar la variación y actualizar los cart attributes: 
const experimentId = 12345;
Kameleoon.API.Experiments.trigger(experimentId);
const experiment = Kameleoon.API.Experiments.getById(experimentId);
const variationName = experiment?.associatedVariation?.name;

if (variationName) {
    fetch('/cart/update.js', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ attributes: { 'kameleoon-checkout-variant': variationName } }),
    });
}

​
Paso 2: Utilizar una Shopify Checkout UI Extension

Dentro de su Shopify Plus Checkout UI Extension, utilice la API de React para leer el atributo kameleoon-checkout-variant. A continuación, puede renderizar un componente condicional, como un banner, solo para variaciones específicas. 
const attributes = useAttributes();
const variant = attributes['kameleoon-checkout-variant'];

if (variant === 'Variation B') {
  return <Banner title="You unlocked free express shipping!" />;
}

​
Realizar el seguimiento de conversiones en la página de agradecimiento

Para realizar el seguimiento de las conversiones de los usuarios en el experimento en la página de confirmación del pedido, consulte la guía sobre conversiones del checkout de Shopify.

​
Resumen

  • Asigne una variación en la página del carrito utilizando un experimento web de Kameleoon.
  • Actualice los cart attributes de Shopify para persistir la variación asignada.
  • Utilice una Shopify Checkout UI Extension para leer la variación y renderizar contenido dinámico.
  • Realice el seguimiento de las conversiones en la página de agradecimiento siguiendo la guía de conversiones.
Esta configuración cumple con las políticas de Shopify Plus y permite una experimentación válida en todo el flujo de checkout.