> ## 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. # Menge/Zähler am Warenkorb-Symbol wird nicht aktualisiert > Dieser Artikel beschreibt, wie du die Mengenanzeige deines Warenkorb-Symbols reparierst, wenn sie in Upcart nicht aktualisiert wird.
# Überblick
Manche Themes aktualisieren das Symbol nicht automatisch, und dieser Leitfaden führt dich Schritt für Schritt durch die Behebung mit ein wenig benutzerdefiniertem Code. Befolge die folgenden Schritte, damit alles korrekt synchronisiert wird. **Hier ein Beispiel, wie diese Abweichung aussieht:** Upcart-Drawer zeigt Cart 2, während die Bubble am Theme-Warenkorb-Symbol noch 1 anzeigt ***
# Wichtige Schritte, bevor du beginnst!
Um das Problem mit dem Warenkorb-Symbol zu beheben, musst du den Klassennamen deines Warenkorb-Symbols ermitteln. Jedes Theme ist anders, und dieser Schritt stellt sicher, dass der Code speziell für deinen Store funktioniert.
### **1. Verwende die Chrome Developer Tools**
Jedes Theme ist anders, daher musst du die Chrome Developer Tools (Untersuchen) verwenden, um den Klassennamen deines Warenkorb-Symbols zu ermitteln. * Klicke in Google Chrome mit der rechten Maustaste auf das Warenkorb-Symbol in deinem Storefront und wähle **Untersuchen**. * Finde das HTML-Element für dein Warenkorb-Symbol (z. B. **``**). * **Brauchst du Hilfe mit den Chrome Developer Tools?** Sieh dir [diesen Leitfaden](https://developer.chrome.com/docs/devtools/overview/) mit Schritt-für-Schritt-Anweisungen an.
### **2. Hol dir Hilfe (optional)**
Wenn du die Klasse deines Warenkorb-Symbols nicht finden kannst oder nicht weiterkommst, keine Sorge! Du hast Optionen: * **Kontaktiere deinen Theme-Entwickler:** Er kennt dein Theme am besten und kann dir helfen, die richtige Klasse zu finden. * **Beauftrage einen Shopify Expert:** Wenn du zusätzliche Unterstützung brauchst, bietet Shopify ein Verzeichnis vertrauenswürdiger Experten, die dir helfen können. [Hier findest du einen Shopify Expert](https://experts.shopify.com/).
## 🚧 **Haftungsausschluss für benutzerdefinierten Code**
Der unten bereitgestellte Beispielcode ist nur eine Vorlage – **er funktioniert nicht, wenn du ihn direkt kopierst und einfügst**. Du musst den Platzhalter-Klassennamen (z. B. **`.cart-count-bubble > span`**) durch den spezifischen Klassennamen deines Warenkorb-Symbols ersetzen. ***
# Schritt-für-Schritt-Lösung
Wir haben diesen Prozess in drei Lösungsstufen unterteilt, beginnend mit der einfachsten Lösung (Level 1). Jede Stufe baut auf der vorherigen auf – probiere zuerst Level 1 und gehe nur bei Bedarf zu Level 2 oder 3 über.
## **Schritt 1: Benutzerdefinierten Code in Upcart hinzufügen**
Da wir zunächst etwas benutzerdefinierten HTML-Code im Upcart-Editor hinzufügen müssen, bereiten wir diesen Bereich vor: 1. Gehe zu **Upcart Editor > Settings** und öffne dann den Tab **Custom HTML** (hinter **More settings**, wenn er nicht in die Tab-Zeile passt). 2. Setze die Position auf **Scripts (Before Load)**. 3. Füge hier deinen bearbeiteten Code ein (Beispiele für jede Stufe findest du unten). So sieht das aus: Upcart-Custom-HTML-Einstellungen mit der HTML-Position auf Scripts Before Load gesetzt ***
# **Schritt 2: Die Lösung je nach Stufe anwenden**
## Level 1 (Einfach)
Wenn der Warenkorb lädt, summiert dieses Skript die Mengen der Warenkorb-Positionen und schreibt den Wert in das Zähler-Element innerhalb der Warenkorb-Bubble deines Themes. Es eignet sich für Themes, bei denen der Zähler in einem einfachen verschachtelten Element liegt (zum Beispiel `.cart-count-bubble > span`). **Nicht vergessen** * Ersetze **`.cart-count-bubble > span`** durch die Klasse deines Warenkorb-Symbols. * Teste es nach dem Hinzufügen des Codes in deinem Storefront. Einfügen des Level-1-Zählerskripts in Upcart Custom HTML mit dem cart-count-bubble-Selektor
## Beispielcode für Level 1
```text theme={"theme":{"light":"snazzy-light","dark":"github-dark"}} ``` **Hinweis zu älteren Versionen:** `window.upcartOnCartLoaded`-Callbacks funktionieren weiterhin, sind aber veraltet und protokollieren Konsolenwarnungen. Verwende `upcartSubscribeCartLoaded` für alle neuen Skripte. Beachte, dass `event.cart` keine `item_count`-Eigenschaft hat – verwende `event.cart.items.reduce((total, item) => total + item.quantity, 0)`, um die Gesamtanzahl der Artikel zu berechnen. ***
## Level 2 (Mittel)
Wenn Level 1 nicht funktioniert hat, ersetzt dein Theme möglicherweise das gesamte HTML des Warenkorb-Symbols, wenn sich der Zähler ändert. Diese Version baut das Symbol-Markup für den leeren bzw. nicht leeren Warenkorbzustand neu auf, damit Zähler und Symbol synchron bleiben. **Nicht vergessen** * Ersetze **`#cart-icon-bubble-custom`** durch den Wrapper-Selektor des Warenkorb-Symbols deines Themes. * Teste es nach dem Speichern. Einfügen des Level-2-Warenkorb-Symbol-Skripts in Upcart Custom HTML mit dem cart-icon-bubble-custom-Selektor
### Beispielcode für Level 2
```text theme={"theme":{"light":"snazzy-light","dark":"github-dark"}} ``` **Hinweis zu älteren Versionen:** `window.upcartOnCartLoaded`-Callbacks funktionieren weiterhin, sind aber veraltet und protokollieren Konsolenwarnungen. Verwende `upcartSubscribeCartLoaded` für alle neuen Skripte. Beachte, dass `event.cart` **keine** `item_count`-Eigenschaft hat – die obigen Skripte ermitteln die Gesamtzahl mit `event.cart.items.reduce((total, item) => total + item.quantity, 0)` und übergeben sie als `itemCount`. Ältere Kopien dieser Snippets, die `cart.item_count` interpolieren, werfen einen `ReferenceError` und aktualisieren das Symbol stillschweigend nie. ***
## Level 3 (Fortgeschritten)
Wenn dein Theme **separates** Warenkorb-Symbol-Markup für Desktop und Mobil verwendet, führe dieselbe Update-Logik für zwei Selektoren aus, damit jeder Viewport das korrekte HTML und den korrekten Zähler erhält. **Nicht vergessen** * Ersetze **`#cart-icon-bubble-custom-desktop`** und **`#cart-icon-bubble-custom-mobile`** durch die Klassen deines Themes. * Teste gründlich sowohl in der Desktop- als auch in der Mobilansicht. Einfügen des Level-3-Skripts in Upcart Custom HTML mit separaten Desktop- und Mobil-Warenkorb-Symbol-Selektoren
### Beispielcode für Level 3
```text theme={"theme":{"light":"snazzy-light","dark":"github-dark"}} ``` **Hinweis zu älteren Versionen:** `window.upcartOnCartLoaded`-Callbacks funktionieren weiterhin, sind aber veraltet und protokollieren Konsolenwarnungen. Verwende `upcartSubscribeCartLoaded` für alle neuen Skripte. Beachte, dass `event.cart` **keine** `item_count`-Eigenschaft hat – die obigen Skripte ermitteln die Gesamtzahl mit `event.cart.items.reduce((total, item) => total + item.quantity, 0)` und übergeben sie als `itemCount`. Ältere Kopien dieser Snippets, die `cart.item_count` interpolieren, werfen einen `ReferenceError` und aktualisieren das Symbol stillschweigend nie. ***
# Funktioniert es immer noch nicht?
Wenn keine dieser Stufen das Problem löst, keine Sorge – du hast noch Möglichkeiten! Das bedeutet wahrscheinlich, dass dein Theme eine fortgeschrittenere Anpassung erfordert. **Das kannst du als Nächstes tun:** * Wende dich an deinen Theme-Entwickler. * Beauftrage einen [Shopify Expert](https://www.shopify.com/partners/directory), der eine maßgeschneiderte Lösung für deinen Store erstellen kann.