Skip to main content
⚠️ Wichtiger Hinweis Diese Anpassung funktioniert nur mit Version 1 der Upcart-Warenkorbmodule. Wenn du deinen Warenkorb kürzlich auf Version 2 aktualisiert hast, funktionieren diese Anpassungen möglicherweise nicht. Du musst die neuen Selektoren für Version 2 aus dem Migrationsleitfaden verwenden. Wenn deine Anpassungen nicht wie erwartet funktionieren, kannst du den Warenkorb selbst auf Version 1 zurücksetzen: Verwende im Cart Editor das Dropdown Cart version oben im linken Menü und wähle V1.0 (Legacy). Das Dropdown erscheint, sobald jedes Modul im Warenkorb auf V2 ist. Wir arbeiten derzeit an neuen Anpassungsvorlagen für Version 2 der Module — sie werden bald verfügbar sein.

​
Einführung

Willkommen zu diesem CSS-Tutorial, in dem wir dir zeigen, wie du die Breite deines mobilen Warenkorbs auf null setzt, sofern er nicht von Upcart ausgelöst wird. Das ist eine praktische Möglichkeit, deinen Warenkorb verborgen zu halten und das mobile Einkaufserlebnis zu verschlanken, bis deine Kunden bereit sind, ihn anzusehen. Diese Anleitung richtet sich an Store-Betreiber oder Entwickler mit grundlegenden CSS-Kenntnissen. Mit dieser Anpassung kannst du deinen Warenkorb außer Sichtweite halten und das Seitenlayout verbessern, Ablenkungen reduzieren und deinen Kunden helfen, sich auf das Einkaufen zu konzentrieren. Es ist eine kleine Änderung, die einen großen Unterschied im mobilen Erlebnis deines Stores machen kann. Legen wir los und lassen wir deinen mobilen Warenkorb smarter arbeiten, nicht härter!

​
Auf die Custom-CSS-Einstellungen zugreifen

Um mit der CSS-Anpassung deines Upcart zu beginnen, folge diesen Schritten:
  1. Öffne die Upcart-App in deinem Dashboard.
  2. Navigiere zum Cart Editor.
  3. Öffne Settings und wähle den Tab Custom CSS (hinter More settings, falls die Tab-Leiste überläuft).
  4. Kopiere als Nächstes den Code und füge ihn in den CSS-Eingabebereich ein
  5. Wenn du fertig bist, klicke auf „Save“ und aktualisiere deine Storefront-Seite, um die Ergebnisse live zu sehen.

​
Hier ist der CSS-Code zum Kopieren und Einfügen in den CSS-Bereich:

​
Fazit

Und das war’s! Du hast jetzt gelernt, wie du die Breite deines mobilen Warenkorbs auf null setzt, bis er von Upcart ausgelöst wird — für ein saubereres und fokussierteres Einkaufserlebnis.

​
🚧 Support für Anpassungen

Das Support-Team von Upcart kann nicht bei der Implementierung von benutzerdefinierten CSS- oder HTML-Lösungen in deinem Warenkorb helfen. Wenn du Hilfe beim Entwerfen oder Stylen von etwas Individuellem brauchst, empfehlen wir dir, einen Shopify-Experten zu konsultieren: Shopify-Experten ansehen