Skip to main content
Deze gids leidt je door het configureren en plaatsen van checkout-widgets in Aftersell, van het inschakelen van widgets tot het optimaliseren van de plaatsing in Shopify Checkout voor maximale conversiepercentages.. Let op: Checkout-widgets zijn alleen beschikbaar voor Shopify Plus-merchants vanwege de beperkingen van Shopify’s Checkout Extensibility API.

Stap 1: Schakel je widget in binnen Aftersell

Voordat je widgets aan je checkout toevoegt, moet je ze inschakelen in het Aftersell-beheer.
  1. Ga naar het tabblad Checkout in je Aftersell-beheer
  2. Selecteer het widgettype dat je wilt configureren (Upsells, Cart Controls, Rewards, Trust Badges, Testimonials, Notes, Images of Text)
  3. Klik op Create om een nieuwe widget te bouwen of selecteer een bestaande widget om te bewerken
  4. Configureer je widgetinstellingen (zie Widgettypes en configuratie hieronder)
  5. Klik op de schakelaar Enable in de rechterbovenhoek van de widgetinstellingen
  6. Voor beperkte of geavanceerde upsells: zorg dat je aangepaste triggers inschakelt voordat je verdergaat

Stap 2: Open de Shopify Checkout Editor

Er zijn twee manieren om de Shopify Checkout Editor te openen: Optie 1: Vanuit Shopify Admin
  1. Ga naar Settings in je Shopify Admin
  2. Klik op Checkout in de linkernavigatie
  3. Klik op Customize naast het gewenste checkout-profiel
Optie 2: Vanuit Aftersell
  1. Klik op de knop Open Shopify Checkout Editor rechtsonder op de pagina van de Aftersell Checkout-editor
💡 Tip: Optie 1 geeft je meer controle over welk checkout-profiel je bewerkt. We raden aan eerst te testen op een conceptversie voordat je deze live zet. Shopify admin-startpagina met de link Settings gemarkeerd om de checkout-editor te openen

Stap 3: Voeg het app block toe aan je checkout

  1. Klik in de Shopify Checkout Editor op Add app block
  2. Selecteer de gewenste Aftersell-widget in de lijst met beschikbare widgets
  3. Kies de juiste plaatsing voor je widget (zie Beschikbare plaatsingen hieronder)
  4. Als je wilt dat je widgets in de Shop Pay-checkout worden getoond, vink dan de optie Include app block in Shop Pay aan
  5. Klik op Save in de rechterbovenhoek
Shopify Checkout Editor met een pijl die wijst naar de knop Add block in de zijbalk

Stap 4: Positioneer je widget

  1. Sleep het app block naar de gewenste locatie binnen het geselecteerde plaatsingsgebied
  2. Klik op Save in de rechterbovenhoek
Blokkenlijst van de Shopify Checkout Editor naast een live checkout-voorbeeld met Aftersell-widgets

Widgettypes en configuratie

Plaatsingen

Plaatsingen worden aangemaakt in de Aftersell Checkout-editor en stellen je in staat om meerdere widgets van hetzelfde type op dezelfde checkout-pagina te draaien. Als je bijvoorbeeld twee upsell-aanbiedingen op dezelfde pagina wilt tonen, moet elke aanbieding aan een andere plaatsing worden toegewezen.

Beschikbare plaatsingen

  • Default placement: De primaire plaatsing. Elk widgettype begint hier.
  • Additional placement 1: Een tweede plaatsingsslot om nog een widget van hetzelfde type op dezelfde pagina te tonen.
  • Additional placement 2: Een derde plaatsingsslot voor verdere scheiding.
Je kunt ook nieuwe plaatsingen rechtstreeks aanmaken vanuit de plaatsingsdropdown in Aftersell door + Add new placement te selecteren. Aftersell Checkout-editor met de plaatsingsdropdown boven de Upsells-lijst en het voorbeeld

Wanneer gebruik je meerdere plaatsingen

Gebruik meerdere plaatsingen wanneer je:
  • Meer dan één widget van hetzelfde type op één checkout-pagina wilt tonen
  • Widgets in verschillende secties van de pagina wilt tonen
  • Verschillende doelgroepen wilt targeten met verschillende aanbiedingen
  • Widgets wilt draaien met vergelijkbare of overlappende triggers
Aftersell gebruikt een prioriteitssysteem. Je kunt binnen dezelfde plaatsing geen meerdere widgets met identieke triggers draaien. Als twee widgets dezelfde triggervoorwaarden delen in één plaatsing, wordt slechts één getoond op basis van prioriteit. Om vergelijkbare triggers te gebruiken, wijs je elke widget toe aan een andere plaatsing, zodat ze onafhankelijk kunnen draaien zonder conflict.

Plaatsingen matchen in de Shopify Checkout Editor

Elke plaatsing in Aftersell komt overeen met een apart app block in de Shopify Checkout Editor. De plaatsing die in Shopify is geselecteerd, moet overeenkomen met de plaatsing die in Aftersell is ingesteld. Als een widget bijvoorbeeld is toegewezen aan Additional placement 1 in Aftersell, moet het app block in Shopify ook op Additional placement 1 staan. Als de plaatsingen niet overeenkomen, verschijnt de widget mogelijk niet of wordt deze op de verkeerde locatie getoond. Belangrijk: Een niet-overeenkomende plaatsing is een van de meest voorkomende redenen dat een widget niet wordt getoond. Als een widget niet verschijnt, controleer dan of de plaatsing in zowel Aftersell als Shopify overeenkomt voordat je verder gaat met probleemoplossing. Shopify Checkout Editor Upsell Widget-blokinstellingen met de dropdown Placement ingesteld op een extra plaatsing

Upsells

Bied producten aan klanten aan tijdens de checkout om je gemiddelde bestelwaarde (AOV) te verhogen. Configuratieopties: Widgetmodi:
  • Single Product Upsell: Toon één product met een Add to Cart-knop
  • Multi-Product Upsell: Toon meerdere producten in een stapel- of carrousel-lay-out, zodat klanten meerdere aanbiedingen kunnen accepteren
  • Checkmark Upsell: Toon één product met een selectievakje in plaats van een Add to Cart-knop (ideaal voor goedkope add-ons zoals verzendbescherming)
Productselectiemethoden:
  • Specific Products: Selecteer handmatig individuele producten voor de upsell
  • Collection: Selecteer een collectie en toon maximaal 5 willekeurige producten (producten die al in de winkelwagen zitten, worden automatisch uitgesloten)
  • Automatic upsell(s): Beveel automatisch producten aan op basis van de winkelwageninhoud
  • Most Expensive Product: Upsell automatisch het duurste product uit de winkelwagen
  • Spend threshold: Beveel producten aan die klanten helpen beloningsdrempels te bereiken (alleen selecteerbaar zodra Show rewards bar is ingeschakeld op dezelfde upsell-widget)
  • Strategy: Selecteer dynamisch een product met behulp van op regels gebaseerde targeting. Alleen zichtbaar in winkels waar Strategies is ingeschakeld
Extra functies:
  • Voeg kortingen direct toe binnen de widget
  • Vergrendel abonnementsplannen op specifieke opties
  • Toon productreviewsterren (vereist een compatibele review-app)
  • Stel een maximumaantal geaccepteerde aanbiedingen per widget in (alleen upselltypes Single en Multi)
Meer informatie over upsell-widgets

Cart Controls

Laat klanten hun winkelwagen rechtstreeks op de checkout-pagina aanpassen. Beschikbare bedieningselementen:
  • Variant selector: Wissel naar een andere variant die op voorraad is
  • Quantity selector: Pas productaantallen aan
  • Remove item: Show Remove Item Button verwijdert upsell-producten uit de winkelwagen. Een bijbehorende instelling, Allow Removal of Non-Upsell Products (standaard uit), breidt het verwijderen uit naar alles in de winkelwagen
  • Subscription selector: Wijzig de abonnementsfrequentie
  • Subscription upgrade: Upgrade eenmalige aankopen naar abonnementen
  • Custom text: Voeg aangepaste tekst toe onder regelitems
Producttargeting:
  • Toepassen op alle producten in de winkelwagen
  • Alleen toepassen op geselecteerde producten
  • Toepassen op alle producten behalve de geselecteerde
Extra functies:
  • Toon productreviewsterren voor producten in de winkelwagen
Meer informatie over cart controls

Rewards

Toon een voortgangsbalk die klanten laat zien hoe dicht ze bij een beloning zijn. Configuratieopties:
  • Beloningsbasis: Cart total of Item count
  • Bedragsbasis (voor Cart total): Order total (includes shipping and tax), Subtotal (before discounts) of Subtotal after discounts (excludes tax and shipping)
  • Beloningsbericht en styling
  • Kleuren en ontwerp van de voortgangsbalk
Best practices:
  • Combineer met upsell-widgets om klanten te helpen beloningsdrempels te bereiken
  • Gebruik het producttype spend threshold in upsells om automatisch producten aan te bevelen die het verschil overbruggen
  • Maak beloningen in Shopify met Automatic Discounts (voor kortingsbeloningen) of Shipping Rules (voor gratis verzending)
  • Gebruik Subtotal after discounts (excludes tax and shipping) als bedragsbasis bij het aanbieden van gratis verzending, zodat de balk overeenkomt met Shopify’s eigen drempelevaluatie wanneer kortingscodes worden toegepast
Meer informatie over rewards

Trust Badges

Bouw vertrouwen op met aangepaste pictogrammen en tekst om de conversie in de checkout te verhogen. Configuratieopties:
  • Badge-lay-out: verticale stapel of horizontale weergave
  • Aangepaste pictogrammen en tekst voor elke badge
  • Opties voor styling en tussenruimte
Best practices:
  • Benadruk beveiligingsfuncties (veilige checkout, SSL-versleuteling)
  • Toon garanties (geld-terug-garantie, gratis retourneren)
  • Toon verzendvoordelen (gratis verzending, snelle levering)
Meer informatie over trust badges

Testimonials

Toon klantreviews rechtstreeks in de checkout om vertrouwen op te bouwen. Configuratieopties:
  • Flex Testimonials (aanbevolen): Haalt automatisch echte reviews op uit je review-app (Judge.me, Klaviyo, Okendo of Yotpo)
  • Selectiemodus: Manual (kies specifieke reviews) of Dynamic (haal automatisch reviews op op basis van de winkelwageninhoud)
  • Weergavetype: horizontale carrousel of verticale stapel
  • Filter op minimale beoordeling
Installatievereisten:
  • Configureer de inloggegevens van je review-app in Settings > Product Reviews
  • Reviews synchroniseren automatisch binnen 24 uur, daarna wekelijks
Meer informatie over testimonials

Notes

Laat klanten notities aan hun bestelling toevoegen. Configuratieopties:
  • Handmatige notities: vrij tekstveld voor klantinvoer
  • Vooraf geschreven notities: selectievakjes voor opties zoals cadeauverpakking of milieuvriendelijke verpakking
Meer informatie over notes

Images

Upload en toon aangepaste afbeeldingen in je checkout. Configuratieopties:
  • Afbeelding uploaden
  • Schuifregelaar voor breedteaanpassing
  • Geen minimale groottevereiste
Meer informatie over images

Text

Voeg een banner met aangepaste tekst toe in je checkout. Configuratieopties:
  • Container Style: Plain Text (de standaard) of Badge. De onderstaande bannerkleuren verschijnen pas zodra je Badge kiest
  • Banner Type (alleen Badge):
    • Info (Blue): blauwe achtergrond met informatiepictogram
    • Success (Green): groene achtergrond met vinkje
    • Warning (Yellow): gele achtergrond met waarschuwingsdriehoek
    • Critical (Red): rode achtergrond met uitroepteken
  • Tekstgrootte op het veld Body (Small of Base) — het veld Heading heeft geen groottecontrole
  • Uitlijning op zowel het Heading- als Body-veld
  • Tussenruimte: None, Extra Tight, Tight, Base, Loose of Extra Loose
Meer informatie over text

Probleemoplossing

Widgets worden niet getoond

Als je widgets na de installatie niet worden getoond:
  1. Controleer of de widget is ingeschakeld in het Aftersell-beheer
  2. Controleer of het app block is toegevoegd in de Shopify Checkout Editor
  3. Bevestig dat het app block is opgeslagen in de Shopify Checkout Editor
  4. Controleer of de juiste plaatsing is geselecteerd. Bij het toevoegen van een app block in de Shopify Checkout Editor moet je de overeenkomende plaatsing kiezen, zoals Default placement, Additional placement 1 of Additional placement 2. Als de verkeerde plaatsing is geselecteerd, verschijnt de widget mogelijk niet of wordt deze op de verkeerde locatie getoond. Verwijder het app block en voeg het opnieuw toe, waarbij je zorgt dat de juiste plaatsing is geselecteerd.
  5. Voor Shop Pay: controleer of “Include app block in Shop Pay” is aangevinkt
  6. Wis je browsercache of probeer de incognitomodus
  7. Wacht een paar minuten tot de wijzigingen zijn doorgevoerd

Shop Pay-widgets worden niet getoond

Om widgets in de Shop Pay-checkout te tonen:
  1. Open de widget in de Shopify Checkout Editor
  2. Vink de optie Include app block in Shop Pay aan onder Checkout behaviour
  3. Sla je wijzigingen op
Zijbalk van de Shopify Checkout Editor met het Aftersell Upsell Widget app block onder Main Meer informatie over Shop Pay-widgets

Volgende stappen