Automatisch een gratis cadeau toevoegen bij een drempel

Houd het winkelwagentotaal in de gaten en houd een gratis cadeau ermee in sync: voeg het cadeau toe zodra de shopper een bestedingsdrempel passeert, verwijder het als hij er weer onder zakt.

Voor een door de merchant geconfigureerde versie met niveaus, regels per markt en een voortgangsbalk gebruik je het Rewards-block, zonder code. Dit is voor wanneer je regel iets is wat het block niet kan uitdrukken.

Het snippet

Plak in Cart settings → Custom script → Initialization, en stel de twee constanten in:

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);

Hoe het werkt

reconcileGift beschrijft de staat waarin de winkelwagen zou moeten zijn, en voert dan hoogstens één wijziging uit om daar te komen:

Komt in aanmerking en het cadeau is er niet → addItem voegt het toe.
Komt niet in aanmerking en het cadeau is er wel → removeItem verwijdert het, via de key van de regel.
Anders → doe niets.

Het draait op zowel cart_loaded (zodat een winkelwagen die bij het laden van de pagina al in aanmerking komt het cadeau krijgt) als cart_updated (zodat het daarna op elke wijziging reageert). Omdat cart_loaded opnieuw wordt afgespeeld voor late subscribers, werkt dit ongeacht wanneer je script draait.

De !gift- / gift-guards zijn wat dit tegen loopen beschermt. Het cadeau toevoegen vuurt cart_updated af, wat reconcileGift opnieuw uitvoert, en de tweede doorloop vindt het cadeau al aanwezig, dus doet die niets. Haal de guards weg en je krijgt een oneindige loop. Zie de twee regels.

Merk op dat het toevoegen van het cadeau het winkelwagentotaal verhoogt, dus een drempel dicht bij de prijs van een product kan oscilleren: een cadeau van $0 toevoegen is veilig, maar een cadeau met een prijs kan de winkelwagen op eigen kracht boven de drempel duwen. Houd het cadeau gratis, of vergelijk met een totaal dat het cadeau uitsluit.

Aanpassen

Gate op aantal items in plaats van besteding:

const qualifies = state.itemCount >= 3;

Gate op een specifiek product in de winkelwagen:

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

Alleen in bepaalde landen. Lees context, dat beschikbaar is voordat de winkelwagen laadt:

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);
}

Sluit het cadeau uit van de drempel zodat het zichzelf niet in stand kan houden:

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

Markeer het cadeau zodat het als cadeau leest. Een line transform kan de titel, varianttitel, verborgen staat en interne properties van een regel wijzigen — dus herlabel het:

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

Een line transform kan de aantal-knoppen van een regel niet verbergen — de enige setters zijn setTitle, setVariantTitle, setHidden en setInternalProperties. Als een shopper het aantal van het cadeau wijzigt, corrigeer dat dan vanuit een cart_updated-handler.

Waar je verder kunt kijken

Rewards block: de no-code-versie, met niveaus.
Actions: addItem, removeItem en de rest.
Events: waarom de guards belangrijk zijn.

Aan de slag

Startpagina

Best practices

Post-purchase upsells

Winkelwagen

Checkout-upsells (Shopify Plus)

Bedankpagina

Upsells op de productpagina

Rokt Thanks

Strategieën

Analytics en tracking

Integraties

Aftersell MCP

Facturering en account

Probleemoplossing

Automatisch een gratis cadeau toevoegen bij een drempel

Het snippet

Hoe het werkt

Aanpassen

Waar je verder kunt kijken

​Het snippet

​Hoe het werkt

​Aanpassen

​Waar je verder kunt kijken

Het snippet

Hoe het werkt

Aanpassen

Waar je verder kunt kijken