Countdown-Banner
Last updated
Last updated
© 2024 by ThemeWare® | Made with 💙 by TC-Innovations GmbH
Der ThemeWare® "Countdown-Banner" ist ein "Sale" Banner-Element für deine Erlebniswelten.
Hinweis: Das Element ist explizit für die Verwendung in seinem eigenen CMS-Block vorgesehen. Es ist nicht für die Nutzung in anderen CMS-Blöcken ausgelegt und lässt sich daher nicht austauschen bzw. in anderen Blöcken platzieren.
Wichtig: Dieses Element ist nur in der ThemeWare® Pro Edition verfügbar.
Der "Countdown-Banner" hat zwei Phasen:
Vorlauf-Phase
Sale-Phase
Die Vorlauf-Phase ist ein Countdown bis zum Beginn des eigentlichen Sales. Dadurch bietet sich die Möglichkeit für einen bevorstehenden Sale zu werben.
Tipp: Verlinke den Button mit deiner Newsletter-Anmeldung-Seite oder mit dem Scroll-Anker #newsletterSubscription
vom ThemeWare® Newsletter Footer-Widget.
Die Sale-Phase ist ein Countdown bis zum Ende des entsprechenden Sales.
Tipp: Verlinke den Button zu einer Sale-Kategorie oder -Landingpage.
Nach Ablauf beider Phasen wird der Block per CSS ausgeblendet. Entferne es dann zum nächstmöglichen Zeitpunkt aus der entsprechenden Erlebniswelt.
Den ThemeWare® "Countdown-Banner" kannst du wie folgt konfigurieren:
Klicke auf den entsprechenden CMS-Block (1) um den Bearbeitungsmodus zu aktivieren
Fahre mit der Maus über das entsprechende CMS-Element
Es öffnet sich das Pop-up "Element-Einstellungen"
Nehme die gewünschten Änderungen vor
Speichere deine Änderungen
Du hast das CMS-Element nun konfiguriert.
Die Konfiguration vom "Countdown-Banner" ist recht selbsterklärend. Das Datum des Sales ("Sale von" und "Sale bis"), die Titel (der Vorlauf- und der Sale-Phase), das Bild und die "Minimale Höhe" sind Pflichtfelder. Mehr brauchst du genau genommen nicht konfigurieren.
Im Tab "Allgemein" konfigurierst du den Content des Elementes.
SaleIm Abschnitt "Sale" legst du das Datum des Sales ("Sale von" und "Sale bis") fest. Wähle ein Datum für die Vorlauf- und ein Datum für die Sale-Phase aus, damit der Countdown für beide Phasen berechnet werden kann.
TextIm Abschnitt "Text" kannst du Texte für die Vorlauf-Phase eingeben. Der Titel ist ein Pflichtfeld.
Text (Sale)Im Abschnitt "Text (Sale)" kannst du Texte für die Sale-Phase eingeben. Der Titel ist ein Pflichtfeld.
BildIm Abschnitt "Bild" definierst du das Hintergrundbild des Banners. Das Bild und die "Minimale Höhe" (Standard:
300px
) sind Pflichtfelder.
LinkIm Abschnitt "Link" definierst du das Ziel des Buttons der Vorlauf-Phase. Wir empfehlen die Newsletter-Anmeldung zu verlinken (siehe oben).
Link (Sale)Im Abschnitt "Link (Sale)" definierst du das Ziel des Buttons der Sale-Phase fest. Wir empfehlen eine entsprechende Sale-Kategorie zu verlinken (siehe oben).
Im Tab "Layout" hast du diverse Gestaltungsmöglichkeiten für den Text, die Buttons und ein Farb-Overlay.
TextIm Abschnitt "Text" kannst du die Schriftart und Textfarbe jeweils für den Text, den Titel und den Untertitel konfigurieren.
ButtonIm Abschnitt "Button" kannst du den Button-Stil (die Farbe) konfigurieren und festlegen ob der Button gefüllt oder als Outline-Button dargestellt werden soll.
Farb-OverlayIm Abschnitt "Farb-Overlay" kann ein Farb-Overlay aktiviert und konfiguriert werden.
Im Tab "Counter" kannst du den Counter konfigurieren.
LayoutIm Abschnitt "Layout" kannst du die gewünschte Darstellungsart auswählen (siehe Darstellungsarten).
ZahlenIm Abschnitt "Zahlen" kannst du die Schriftart und Textfarbe der Zahlen des Counters konfigurieren.
LabelsIm Abschnitt "Labels" kannst du die Schriftart und Textfarbe der Labels (Text unter den Zahlen) des Counters konfigurieren.
Derzeit stehen dir drei verschiedene Darstellungsarten (siehe Screenshots unten) für den Counter zur Verfügung:
Schlichter Countdown
Farbig hinterlegte Zahlen
Bunt hinterlegte Zähler
Wie du an der Vorschaugrafik vom "Countdown-Banner" erkennen kannst, ist es für die Lesbarkeit sinnvoll dem Text etwas "Raum" zu lassen.
Tipp: Damit du das perfekte Hintergrundbild bauen kannst, findest du in den ThemeWare® Utilities eine PSD-Vorlagen für CMS-Elemente.
twt.cms.countdownBanner.days
twt.cms.countdownBanner.hours
twt.cms.countdownBanner.minutes
twt.cms.countdownBanner.seconds
Anwendungsbeispiele findest du in unseren Demoshops:
Demo folgt...
Klicke auf das "Zahnrad"-Icon (2) um das CMS-Element zu konfigurieren