Agregar automáticamente un regalo gratis en un umbral

Observa el total del carrito y mantén un regalo gratis sincronizado con él: agrega el regalo una vez que el comprador cruza un umbral de gasto, elimínalo si vuelve a caer por debajo.

Para una versión configurada por el comerciante con niveles, reglas por mercado y una barra de progreso, usa el bloque Rewards, sin código. Esto es para cuando tu regla es algo que el bloque no puede expresar.

El snippet

Pega en Cart settings → Custom script → Initialization, y establece las dos constantes:

const FREE_GIFT_VARIANT_ID = 1234567890; // the gift product's variant id
const THRESHOLD_CENTS = 5000;            // $50.00, since totals are in cents

function reconcileGift(state) {
  const gift = state.items.find((line) => line.variantId === FREE_GIFT_VARIANT_ID);
  const qualifies = state.totalPrice >= THRESHOLD_CENTS;

  if (qualifies && !gift) {
    window.aftersell.cart.actions.addItem(FREE_GIFT_VARIANT_ID, 1);
  } else if (!qualifies && gift) {
    window.aftersell.cart.actions.removeItem(gift.key);
  }
}

window.aftersell.cart.events.on('cart_loaded', reconcileGift);
window.aftersell.cart.events.on('cart_updated', reconcileGift);

Cómo funciona

reconcileGift describe el estado en el que el carrito debería estar, y luego hace como máximo un cambio para llegar ahí:

Califica y el regalo no está → addItem lo agrega.
No califica y el regalo está → removeItem lo elimina, por la key de la línea.
De lo contrario → no hace nada.

Se ejecuta tanto en cart_loaded (para que un carrito que ya califica al cargar la página reciba el regalo) como en cart_updated (para que reaccione a cada cambio posterior). Como cart_loaded se reproduce para los suscriptores tardíos, esto funciona sin importar cuándo se ejecute tu script.

Las protecciones !gift / gift son lo que impide que esto entre en bucle. Agregar el regalo dispara cart_updated, que ejecuta reconcileGift de nuevo, y la segunda pasada encuentra el regalo ya presente, así que no hace nada. Quita las protecciones y obtienes un bucle infinito. Consulta las dos reglas.

Ten en cuenta que agregar el regalo aumenta el total del carrito, así que un umbral cercano al precio de un producto puede oscilar: agregar un regalo de $0 es seguro, pero un regalo con precio podría empujar el carrito por encima del umbral por sí solo. Mantén el regalo gratis, o compara contra un total que lo excluya.

Adaptarlo

Condicionar por cantidad de artículos en lugar de gasto:

const qualifies = state.itemCount >= 3;

Condicionar a que un producto específico esté en el carrito:

const qualifies = state.items.some((line) => line.productId === TRIGGER_PRODUCT_ID);

Solo en ciertos países. Lee context, que está disponible antes de que el carrito se cargue:

const ELIGIBLE = ['US', 'CA'];

// Only register the handlers for eligible countries.
if (ELIGIBLE.includes(window.aftersell.cart.context.customer_country)) {
  window.aftersell.cart.events.on('cart_loaded', reconcileGift);
  window.aftersell.cart.events.on('cart_updated', reconcileGift);
}

Excluir el regalo del umbral para que no pueda sostenerse a sí mismo:

const subtotalWithoutGift = state.items.reduce(
  (sum, line) => (line.variantId === FREE_GIFT_VARIANT_ID ? sum : sum + line.finalLinePrice),
  0
);
const qualifies = subtotalWithoutGift >= THRESHOLD_CENTS;

Marca el regalo para que se lea como un regalo. Una transformación de línea puede cambiar el título de una línea, el título de la variante, su estado oculto y sus propiedades internas. Así que reetiquétala:

window.aftersell.cart.hooks.registerLineTransform((line) => {
  if (line.variantId === FREE_GIFT_VARIANT_ID) {
    line.setTitle('Free gift 🎁');
  }
});

Una transformación de línea no puede ocultar los controles de cantidad de una línea: sus únicos setters son setTitle, setVariantTitle, setHidden y setInternalProperties. Si un comprador cambia la cantidad del regalo, corrígela desde un handler de cart_updated en su lugar.

Adónde ir después

Bloque Rewards: la versión sin código, con niveles.
Acciones: addItem, removeItem y el resto.
Eventos: por qué importan las protecciones.

Primeros pasos

Página de inicio

Mejores prácticas

Ventas adicionales poscompra

Carrito

Ventas adicionales en el pago (Shopify Plus)

Página de agradecimiento

Ventas adicionales en la página de producto

Rokt Thanks

Estrategias

Analíticas y seguimiento

Integraciones

Aftersell MCP

Facturación y cuenta

Solución de problemas

Agregar automáticamente un regalo gratis en un umbral

El snippet

Cómo funciona

Adaptarlo

Adónde ir después

​El snippet

​Cómo funciona

​Adaptarlo

​Adónde ir después

El snippet

Cómo funciona

Adaptarlo

Adónde ir después