> ## 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.

# Wie funktionieren Warenkörbe?

> Wie ein Aftersell Cart aufgebaut ist: gefüllte und leere Zustände, Header-/Body-/Footer-Bereiche und wie Blöcke in jeden davon passen.

Ein **Warenkorb** in Aftersell ist eine konfigurierbare Cart-Drawer-Experience. Du gestaltest ihn in zwei **Zuständen**, verteilst ihn über drei **Bereiche** und füllst diese Bereiche mit **Blöcken**.

<div id="cart-states">
  ## Warenkorb-Zustände
</div>

Jeder Warenkorb hat zwei unabhängige Layouts. Du wechselst im Editor zwischen ihnen:

* **Gefüllter Warenkorb**: was Käufer sehen, wenn der Warenkorb Artikel enthält.
* **Leerer Warenkorb**: was Käufer sehen, wenn der Warenkorb keine Artikel enthält.

Manche Blöcke gehören nur in einen Zustand:

* Der [**Empty cart**](/de/aftersell/cart/empty-cart-block)-Block erscheint nur im **leeren** Zustand.
* [**Cart items**](/de/aftersell/cart/cart-items-block), [**Checkout button**](/de/aftersell/cart/checkout-button-block), [**Notes**](/de/aftersell/cart/notes-block), [**Express payments**](/de/aftersell/cart/express-payments-block) und [**Shipping protection**](/de/aftersell/cart/shipping-protection-block) erscheinen nur im **gefüllten** Zustand.

Andere Blöcke (Header, Banner, Rewards, Image, Custom code und mehr) können in beiden Zuständen leben. Neue Warenkörbe starten mit **Header + Empty cart** im leeren Zustand und **Header → Banner → Cart items → Summary → Checkout button** im gefüllten Zustand.

<Info>
  Der **Zustand „leerer Warenkorb“** ist das gesamte leere Layout. Der **Empty cart-Block** ist ein Block innerhalb dieses Layouts, in der Regel die Nachricht und der Weiter-einkaufen-Button. Die Begriffe klingen ähnlich, aber der Zustand kann mehr als diesen einen Block enthalten.
</Info>

<div id="sections">
  ## Bereiche
</div>

Jeder Zustand ist in drei Bereiche unterteilt: **Header**, **Body** und **Footer**. Bereiche steuern, wo ein Block sitzt und wie er scrollt:

* **Header**: am oberen Rand des Drawers fixiert; bleibt sichtbar, während der Body scrollt.
* **Body**: die scrollbare Mitte. Blöcke hier bewegen sich mit dem Inhalt. Gesperrter Block: **Cart items**.
* **Footer**: am unteren Rand des Drawers fixiert. Gesperrter Block: **Checkout button**.

Wenn du einen Block hinzufügst oder verschiebst, bestimmt sein Bereich sein Scroll-Verhalten. Nicht jeder Block ist in jedem Bereich verfügbar. Siehe [Wie funktionieren Blöcke?](/de/aftersell/cart/blocks-overview#blocks-available-in-each-section)

<div id="blocks">
  ## Blöcke
</div>

Ein **Block** ist ein konfigurierbares Teil des Drawers (die Produktliste, ein Upsell-Angebot, ein Checkout-Button und so weiter). Du stapelst sie in einem Bereich, ordnest sie neu an und stylst sie. Wie das Hinzufügen, Limits, Unterblöcke und Bedingungen funktionieren, erfährst du unter [Wie funktionieren Blöcke?](/de/aftersell/cart/blocks-overview)

<div id="next-steps">
  ## Nächste Schritte
</div>

* [Einen Warenkorb erstellen](/de/aftersell/cart/creating-carts)
* [Einen Warenkorb in der Vorschau ansehen](/de/aftersell/cart/previewing-carts)
* [Mehrere Warenkörbe verwalten](/de/aftersell/cart/having-multiple-carts)