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

# Cart-Einstellungen

> Verhaltenseinstellungen für den Aftersell Cart — wann sich der Drawer öffnet und die Theme-Selektoren, die dein Storefront synchron halten.

Neben dem [Styling](/de/aftersell/cart/design-settings) hat der Cart einige **Verhaltens**-Einstellungen, die steuern, wie er mit deinem Storefront interagiert — wann sich der Drawer öffnet und welche Theme-Elemente Aftersell mit dem Cart synchron hält.

<div id="where-to-find-these">
  ## Wo du diese Einstellungen findest
</div>

Öffne im Cart-Editor **Cart settings**. Die folgenden Optionen sind unter **Behavior** und **Custom selector** gruppiert.

<div id="open-the-cart-when-an-item-is-added">
  ## Den Cart öffnen, wenn ein Artikel hinzugefügt wird
</div>

**Open cart when an item is added** steuert, ob sich der Drawer automatisch öffnet, sobald ein Kunde ein Produkt hinzufügt. Standardmäßig aktiviert. Deaktiviere die Option, wenn der Cart geschlossen bleiben soll, bis der Kunde ihn selbst öffnet.

<div id="theme-selectors">
  ## Theme-Selektoren
</div>

Aftersell klinkt sich über CSS-Selektoren in dein Storefront ein — zum Beispiel, um zu wissen, welches Element den Cart öffnet oder welcher Zähler am Warenkorbsymbol synchron gehalten werden soll. Die integrierte Erkennung deckt die beliebtesten Shopify-Themes ab (Dawn, Sense, Crave, Debut, Impulse, Horizon und viele andere), sodass **die meisten Stores diese Einstellungen nie anfassen müssen**. Passe einen Selektor nur an, wenn etwas in deinem Theme nicht korrekt verknüpft wird.

<div id="selector-modes">
  ### Selektor-Modi
</div>

Jeder Selektor bietet dieselben drei Modi:

| Modus                | Was er bewirkt                                                                                                                                                                                                |
| -------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Default**          | Verwendet Aftersells integrierte Erkennung für unterstützte Themes.                                                                                                                                           |
| **Default + custom** | Behält die integrierte Erkennung bei und fügt deinen eigenen Selektor hinzu — nutze dies, wenn der Standard größtenteils funktioniert, aber ein Element übersieht (zum Beispiel ein separates Mobile-Symbol). |
| **Custom only**      | Ignoriert die integrierte Erkennung und verwendet nur deinen Selektor — nutze dies, wenn der Standard das falsche Element anspricht oder mit deinem Theme in Konflikt steht.                                  |

Das Selektor-Eingabefeld ist nur in den Modi **Default + custom** und **Custom only** aktiviert.

<div id="the-three-selectors">
  ### Die drei Selektoren
</div>

| Selektor                 | Was er anspricht                                                                                                      | Beispiel                    |
| ------------------------ | --------------------------------------------------------------------------------------------------------------------- | --------------------------- |
| **Open cart selector**   | Das Element bzw. die Elemente, die den Cart-Drawer öffnen sollen.                                                     | `.header__cart-toggle`      |
| **Add to cart selector** | Die Add-to-Cart-Schaltfläche(n), in die sich Aftersell einklinken soll.                                               | `.product-form__add-button` |
| **Cart count selector**  | Das Element am Warenkorbsymbol deines Themes, das die Artikelanzahl anzeigt, damit es mit dem Drawer synchron bleibt. | `.header__cart-count span`  |

<div id="how-to-find-a-selector">
  ### So findest du einen Selektor
</div>

1. Öffne dein Storefront in einem Browser (Chrome empfohlen).
2. Klicke mit der rechten Maustaste auf das Element, das du ansprechen möchtest — dein Warenkorbsymbol, die Zählernummer oder die Add-to-Cart-Schaltfläche — und wähle **Untersuchen**.
3. Suche im geöffneten Panel das Element, das es repräsentiert (der Zähler ist oft ein `span` innerhalb des Warenkorbsymbols).
4. Notiere seine Klasse (beginnt mit `.`) oder ID (beginnt mit `#`) — zum Beispiel `.header__cart-count span` oder `#CartCount`.
5. Zurück in den **Cart settings** stelle den Selektor auf **Default + custom** oder **Custom only** und füge ihn ein.
6. Speichere und teste dann sowohl auf dem Desktop als auch auf Mobilgeräten.

<Tip>
  Beginne mit **Default** — es funktioniert bei den meisten Themes ohne Einrichtung. Greife zu **Default + custom**, wenn nur eines von mehreren Symbolen aktualisiert wird (etwa Desktop funktioniert, aber Mobile nicht), und zu **Custom only**, wenn der Standard das falsche Element anspricht. Wenn du unsicher bist, welchen Selektor du verwenden sollst, kann dir dein Theme-Entwickler helfen — du musst keinen Code schreiben, nur kopieren und einfügen.
</Tip>