> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Hoe werken blokken?

> Begrijp de blokken van de Aftersell Cart: secties en sub-blokken, gevuld versus leeg, limieten, vergrendelde blokken, condities en instellingen per blok.

De lay-out van je cart is een stapel **blokken**: configureerbare onderdelen die je toevoegt, herschikt, stylet en aanpast in de cart-editor. Welke blokken je opneemt, en in welke volgorde, bepaalt de cart die shoppers zien.

Voor hoe blokken binnen **statussen** en **secties** zitten, zie [Hoe werken carts?](/nl/aftersell/cart/how-carts-work).

<div id="blocks-and-sub-blocks">
  ## Blokken en sub-blokken
</div>

Er zijn twee soorten blokken:

* **Blokken** staan direct in de cart, in een van drie secties: **Header**, **Body** of **Footer**. Elke sectie biedt een andere set blokken.
* **Sub-blokken** nestelen zich binnen een ander blok. Op dit moment host alleen [**Cart items**](/nl/aftersell/cart/cart-items-block) sub-blokken: de **Product**-rij (de regelitemrij zelf), [**Subscription upgrade**](/nl/aftersell/cart/subscription-upgrade-block) en [**Custom code**](/nl/aftersell/cart/custom-code-blocks).

<div id="adding-reordering-and-removing-blocks">
  ## Blokken toevoegen, herschikken en verwijderen
</div>

* **Voeg** een blok toe met de kiezer **Add block**. Een blok is grijs als het niet kan staan waar je het toevoegt, of als je de limiet hebt bereikt (de kiezer toont een `count/max`-badge).
* **Herschik** door een blok binnen zijn sectie te slepen.
* **Verwijder** met het prullenbak-icoon, behalve vergrendelde blokken (hieronder).
* **Toon/verberg** de meeste blokken met de oog-schakelaar, die een blok voor shoppers verbergt zonder het te verwijderen. Een paar structurele blokken kunnen niet worden verborgen: **Cart items**, **Checkout button** en de **Product**-rij.

<div id="locked-blocks">
  ## Vergrendelde blokken
</div>

Sommige blokken kunnen wel worden herschikt maar niet verwijderd, zodat kernfunctionaliteit van de cart (bijvoorbeeld afrekenen) niet per ongeluk kan worden weggehaald:

* **Cart items**
* **Checkout button**

<div id="default-blocks">
  ## Standaardblokken
</div>

Nieuwe carts starten met een werkende standaardlay-out:

* **Gevulde cart:** Header, Banner, Cart items, Summary, Checkout button
* **Lege cart:** Header, Empty cart-blok

<Info>
  De **lege cart-status** is de hele lege lay-out. Het **Empty cart-blok** is één blok daarbinnen. Zie [Hoe werken carts?](/nl/aftersell/cart/how-carts-work) voor het verschil.
</Info>

<div id="how-many-of-each-block-you-can-add">
  ## Hoeveel je van elk blok kunt toevoegen
</div>

Limieten worden geteld **per cart-status**, niet per cart. De gevulde cart en de lege cart hebben elk hun eigen limiet, dus een cart kan drie Banners bevatten in zijn gevulde lay-out en nog drie in zijn lege lay-out.

De meeste blokken zijn beperkt tot één per status. De uitzonderingen:

| Blok           | Maximum per cart-status |
| -------------- | ----------------------- |
| Banner         | 3                       |
| Image          | 3                       |
| Product add-on | 3                       |
| Summary        | 2                       |
| Custom code    | Onbeperkt               |

<div id="content-design-and-code">
  ## Content, Design en Code
</div>

Elk blok wordt geconfigureerd via maximaal drie vlakken in de editor:

* **Content**: de instellingen van het blok (tekst, productkeuzes, drempels, enzovoort). Het **Custom code**-blok is de enige uitzondering: het heeft geen Content-paneel omdat het blok *de code is*.
* **Design**: styling per blok die bovenop je globale [**Designinstellingen**](/nl/aftersell/cart/design-settings) komt. Elk blok heeft er een, behalve **Custom code**, dat helemaal geen instellingenpaneel heeft.
* **Code**: overschrijf de ingebouwde rendering van het blok met een [**aangepaste template**](/nl/aftersell/cart/custom-templates). De meeste blokken ondersteunen dit; een paar niet.

<div id="show-or-hide-by-market-country-or-currency">
  ## Tonen of verbergen per markt, land of valuta
</div>

Sommige blokken kunnen andere instellingen tonen, of volledig verbergen, op basis van wie de koper is. Dat staat los van de **oog-schakelaar** in de zijbalk, die een blok voor iedereen aan- of uitzet.

|                  | **Oog-schakelaar**                                  | **Condities**                                               |
| ---------------- | --------------------------------------------------- | ----------------------------------------------------------- |
| **Wat het doet** | Het hele blok verbergen of tonen voor alle shoppers | Kiezen welke instellingsvariant een shopper ziet (of niets) |
| **Op basis van** | Jouw keuze in de editor                             | Shopify-markt, land van de klant of valuta van de klant     |
| **Waar**         | Oog-icoon in de zijbalk bij de meeste blokken       | Instellingenpaneel bij blokken die condities ondersteunen   |

**Ondersteunde conditietypen op dit moment:** Shopify-markt, land van de klant en valuta van de klant (elk met **In** of **Not in**). Carttotaal en cartinhoud zijn **geen** conditietypen. Gebruik de tier-drempels van [Rewards](/nl/aftersell/cart/rewards-block) voor voortgang op basis van bestedingen/aantallen, of de [Cart SDK](/nl/aftersell/cart/sdk-overview) wanneer je een regel nodig hebt die de editor niet kan uitdrukken.

Condities vormen een geordende lijst: de **eerste overeenkomende** conditie wint. Zet specifieke regels boven een **All buyers**-vangnet. Als niets overeenkomt, rendert het blok niets voor die shopper.

**In de editor is op dit moment** de volledige Conditions-UI beschikbaar op het [**Rewards**](/nl/aftersell/cart/rewards-block#per-market-rewards)-blok: verschillende tier-sets per markt, land of valuta. Andere blokken gebruiken ofwel één "all buyers"-configuratie of doen nog niet mee in dit systeem.

De editorvoorvertoning evalueert **niet** de echte koper. Selecteer een conditie in het paneel om die variant te bekijken.

<div id="all-blocks">
  ## Alle blokken
</div>

**Structuur**

* [Header](/nl/aftersell/cart/header-block): titel, aantal items, logo en sluitknop, vastgezet bovenaan.
* [Cart items](/nl/aftersell/cart/cart-items-block): de items die klanten aan de cart toevoegen; herhaalt per regel.
* [Subscription upgrade](/nl/aftersell/cart/subscription-upgrade-block): sub-blok dat aanbiedt een regel om te zetten naar een abonnement.
* [Summary](/nl/aftersell/cart/summary-block): totalen, besparingen en toegepaste kortingen.
* [Checkout button](/nl/aftersell/cart/checkout-button-block): de primaire call-to-action naar de checkout.
* [Empty cart](/nl/aftersell/cart/empty-cart-block): de content die wordt getoond wanneer de cart leeg is.
* [Express payments](/nl/aftersell/cart/express-payments-block): versnelde checkout-knoppen (Shop Pay, PayPal, enzovoort) binnen de cart.

**Merchandising**

* [Upsells](/nl/aftersell/cart/upsells-block): productaanbevelingen gekozen op basis van een strategie.
* [Product add-on](/nl/aftersell/cart/product-add-on-block): één specifiek product aangeboden als add-on.
* [Rewards](/nl/aftersell/cart/rewards-block): gelaagde beloningen zoals gratis verzending of cadeaus.
* [Shipping protection](/nl/aftersell/cart/shipping-protection-block): een opt-in add-on voor verzendbescherming.

**Invoer van shoppers**

* [Discount code](/nl/aftersell/cart/discount-code-block): een veld om een kortingscode toe te passen.
* [Notes](/nl/aftersell/cart/notes-block): een veld voor bestelnotities.

**Content**

* [Banner](/nl/aftersell/cart/banner-block): een berichtenbanner, met een optionele afteltimer.
* [Image](/nl/aftersell/cart/image-block): één afbeelding of een gehoste preset zoals betaaliconen.
* [Custom code](/nl/aftersell/cart/custom-code-blocks): aangepaste HTML of React overal in de cart.

**Uitbreiden**

* [Aangepaste templates](/nl/aftersell/cart/custom-templates): overschrijf hoe elk blok rendert via het tabblad Code.

<div id="blocks-available-in-each-section">
  ## Beschikbare blokken per sectie
</div>

Elke sectie heeft een andere set beschikbare blokken. Dat houdt de lay-out gefocust en vermindert rommel.

| Sectie     | Beschikbare blokken                                                                                                                                 |
| ---------- | --------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Header** | Header, Banner, Rewards, Image, Custom code                                                                                                         |
| **Body**   | Banner, Notes, Discount code, Cart items, Empty cart, Custom code, Rewards, Product add-on, Shipping protection, Image, Upsells                     |
| **Footer** | Banner, Notes, Discount code, Custom code, Rewards, Product add-on, Shipping protection, Express payments, Image, Upsells, Summary, Checkout button |

Sommige van die blokken zijn statusspecifiek (bijvoorbeeld Empty cart alleen in de lege status). Zie [Hoe werken carts?](/nl/aftersell/cart/how-carts-work).

<div id="block-validation-errors">
  ## Validatiefouten van blokken
</div>

Als de instellingen van een blok een ongeldige waarde bevatten, verschijnt er een kleine rode stip naast de naam van dat blok in de zijbalk. De stip blijft staan totdat je het probleem oplost. Het is geen wegklikbare melding.

Zolang een blok een fout heeft, is **opslaan geblokkeerd**. De **Save**-knop blijft klikbaar, maar erop klikken toont een fouttoast (*"Fix the errors in your cart blocks before saving"*) en springt naar het eerste blok met een probleem, waarbij de instellingen worden geopend zodat je het gemarkeerde veld kunt corrigeren. **Publish** vereist bovendien dat er geen niet-opgeslagen wijzigingen zijn, dus die blijft onbeschikbaar totdat een schone save slaagt.

Zodra het ongeldige veld is gecorrigeerd, verdwijnt de stip vanzelf en verloopt het opslaan weer normaal.

<Note>
  Verborgen blokken worden nog steeds gevalideerd. Een blok dat je hebt verborgen kan een ongeldige instelling bevatten, een foutstip tonen en het opslaan blokkeren, precies zoals een zichtbaar blok. Dus als opslaan is geblokkeerd en elk zichtbaar blok er goed uitziet, controleer dan je verborgen blokken.
</Note>