Die Höheneinstellung steuert, wie dick die Ankündigungsleiste erscheint. Sie bietet drei Optionen: Slim, Normal und Thick. Slim hält den Drawer kompakter und schafft Platz für den Warenkorbinhalt – besonders hilfreich auf kleineren Bildschirmen. Normal liegt zwischen den beiden. Thick sorgt für stärkere visuelle Betonung und hilft, dass deine Botschaft bei den Kunden auffällt.
Verwende die Positionseinstellung, um festzulegen, ob die Ankündigungsleiste Before products oder After products im Cart Drawer erscheint.
Before products platziert die Leiste oben im Warenkorb-Körper, direkt unter dem Header.
After products platziert sie unten im Warenkorb-Körper, direkt über dem Footer – unterhalb der Notiz- und Upsell-Module, falls diese ebenfalls dort platziert sind.
Wenn die Ankündigung nach einer bestimmten Zeit ablaufen soll, lege im Feld Timer duration einen Countdown fest. Es akzeptiert das Format MM:SS – 05:00 für fünf Minuten, 00:30 für dreißig Sekunden. Die Sekunden müssen zwischen 00 und 59 liegen; das Feld lehnt alles Höhere ab.Der Countdown läuft nur, wenn dein Ankündigungstext die Timer-Variable enthält. Sobald er abgelaufen ist, wird die gesamte Ankündigungsleiste automatisch aus dem Warenkorb entfernt.
Der integrierte Countdown-Timer ist sitzungsbasiert und zählt von einer festgelegten Anzahl von Minuten herunter. Er unterstützt keine wiederkehrenden oder täglichen Countdowns, die zu einer bestimmten Uhrzeit zurückgesetzt werden (zum Beispiel ein täglicher Countdown bis 14:00 Uhr). Diese Funktionalität ist in Upcart derzeit nicht verfügbar.
In diesem Abschnitt kannst du die im Ankündigungsbanner angezeigte Nachricht eingeben und formatieren. Du kannst bestimmte Textabschnitte über die Formatierungsleiste oberhalb des Eingabefelds gestalten, die Optionen für Fett, Kursiv, Unterstreichung und Farbe enthält.
Das Feld für den Ankündigungstext unterstützt keine Hyperlinks – es gibt keine Link- oder URL-Schaltfläche in der Formatierungsleiste, und eingefügte <a>-Tags oder Markdown-Links werden beim Speichern entfernt. Um die Ankündigung anklickbar zu machen oder einen Link einzufügen, verwende stattdessen das Modul Custom HTML (siehe unten).
Einen Link oder eine URL zur Ankündigung hinzufügen
Da das integrierte Feld für den Ankündigungstext keine Hyperlinks darstellt, kannst du die Ankündigungsleiste ersetzen oder ergänzen, indem du mit Custom HTML einen Link einfügst:
Setze HTML Location auf Above announcements/rewards (um über der Ankündigungsleiste zu erscheinen) oder Below header/announcements/rewards (um direkt darunter zu erscheinen).
Füge ein Snippet mit deinem Link ein, zum Beispiel:
<div style="text-align: center; padding: 8px;"> <a href="https://yourstore.com/sale" style="color: #ffffff; text-decoration: underline;"> Shop the sale → </a></div>
Klicke auf Save und teste es dann in deinem Live-Warenkorb.
Mehr zu den Custom-HTML-Positionen und zum Styling findest du unter Custom HTML und Custom CSS. Das Support-Team von Upcart schreibt oder debuggt keinen benutzerdefinierten Code – wende dich an einen Shopify Expert, wenn du Hilfe bei der Erstellung brauchst.Wenn du die Countdown-Funktion verwendest, füge die Timer-Variable direkt in deine Nachricht ein. Verwende {{timer}} für V2-Warenkörbe oder {TIMER} für V1-Warenkörbe.
Achte darauf, die Timer-Variable ({{timer}} für V2, {TIMER} für V1) manuell einzutippen, statt sie zu kopieren und einzufügen. So vermeidest du versteckte Formatierungsprobleme, die verhindern könnten, dass der Timer in deinem Live-Warenkorb korrekt angezeigt wird.
Du kannst die Größe des Ankündigungstexts über den Schieberegler steuern, mit Optionen von 10px bis 24px. Das hilft, die Lesbarkeit sowohl auf Mobilgeräten als auch auf dem Desktop sicherzustellen.
Mit Background Color legst du die allgemeine Füllfarbe der Ankündigungsleiste fest. Mit Border Color passt du die horizontalen Linien über und unter dem Banner an, um einen gestalteten Container-Look zu erzielen.
Für zusätzliche Funktionalität kann JavaScript verwendet werden, um den Countdown-Timer anzupassen. Füge dein Skript im Abschnitt “Scripts (Before Load)” hinzu, nicht im Custom-HTML-Modul. Dies ist eine Anforderung an den Ladezeitpunkt, keine Sicherheitsbeschränkung – Custom HTML führt Skripte durchaus aus, aber sie laufen zu spät, um sich zuverlässig in das Ladeereignis des Warenkorbs einzuklinken. Der Abschnitt “Scripts (Before Load)” führt deinen Code aus, bevor der Warenkorb lädt, sodass Callbacks wie upcartSubscribeCartLoaded korrekt ausgelöst werden. Beispielcode:
<script> window.upcartSubscribeCartLoaded(function(event) { // Your countdown timer code here // event.cart contains the cart object with .items[], .total, .currency });</script>
Hinweis zu älteren Versionen: window.upcartOnCartLoaded funktioniert weiterhin, ist aber veraltet und protokolliert eine Konsolenwarnung. Verwende upcartSubscribeCartLoaded für alle neuen Skripte.Teste die Platzierung und Syntax deines Codes sorgfältig. Einige Plattformbeschränkungen können weiterhin beeinflussen, wie Skripte verarbeitet werden.
War diese Seite hilfreich?
⌘I
Assistant
Responses are generated using AI and may contain mistakes.
