Delivery Helper – Aussehen, Platzierung und Sichtbarkeit

Dieser Artikel beschreibt, wie sich Aussehen, Platzierung und Sichtbarkeit von Kostenloser-Versand-Hinweis und Get-it-by Timer steuern lassen. Diese Einstellungen liegen teils im jeweiligen Feature-Reiter, teils im gemeinsamen Reiter „Anzeige & Zeitfenster“.

Anzeige & Zeitfenster

Hier wird für beide Hinweise getrennt festgelegt, wem und wann sie gezeigt werden:

• Kundengruppen – Mehrfachauswahl. Nichts ausgewählt bedeutet: alle Kundengruppen.
• Versandklassen (nur beim Kostenloser-Versand-Hinweis) – Mehrfachauswahl. Nichts ausgewählt bedeutet: alle Versandklassen. Beim Get-it-by Timer entscheidet stattdessen die passende Liefer-Regel.
• Aktive Wochentage – sieben Kontrollkästchen von Montag bis Sonntag. An nicht angehakten Tagen bleibt der Hinweis unsichtbar; mindestens ein Wochentag muss aktiv sein.
• Gültig ab / Gültig bis – Kalenderfelder für befristete Aktionen. Leer gelassen bedeutet unbefristet gültig.

Darstellung

Die Einstellung Darstellung (je Feature eigene Einstellung) bietet drei Wege:

• Wie der Shop (Standard) – der Hinweis bekommt keine eigene Farbfläche, sondern übernimmt Rahmenfarbe, Eckenradius und Schrift aus dem Shop-Template. Die Farbeinstellungen unten haben in diesem Modus keine Wirkung.
• Eigene Farben – der Hinweis wird zur farbigen Box mit den unten gewählten Farben.
• Eine Design-Vorlage – auffälligere, fertig gestaltete Varianten mit fester Struktur.

Design-Vorlagen Kostenloser Versand

Design-Vorlagen Get-it-by Timer

Die vier Timer-Vorlagen mit Countdown zeigen einen sekundengenauen Countdown bis zum Cutoff. Er läuft im Browser des Kunden und bleibt deshalb auch bei zwischengespeicherten Seiten korrekt. Ist der Cutoff für heute bereits vorbei, wird kein Countdown gerendert; es bleibt bei „Versand morgen“ beziehungsweise „Versand am nächsten Werktag“.

Farben in den Vorlagen

Die Vorlagen übernehmen eine Farbe aus den Plugin-Einstellungen und leiten alles Weitere davon ab: beim Kostenloser-Versand-Hinweis die Akzentfarbe, beim Timer die Zeit-Countdown-Farbe. Getönte Flächen, Rahmen und Balken-Hintergründe entstehen automatisch als Abstufungen dieser Farbe; die Schriftfarbe auf der Akzentfläche wird über die WCAG-Kontrastformel bestimmt, sodass ein Kontrast von mindestens 4,5:1 erreicht wird. Um die Vorlage in der eigenen Hausfarbe zu zeigen, genügt es, diese als Akzentfarbe beziehungsweise Countdown-Farbe einzutragen.

Eigene Farben

Im Modus „Eigene Farben“ stehen je Feature folgende Einstellungen zur Verfügung:

Bei eigenen Farben auf ausreichenden Kontrast achten: dunkle Schrift auf dunklem Grund ist für viele Kunden nicht lesbar. Der Colorpicker im Backend speichert Farben als HEX- oder als rgb()-Wert; beides wird akzeptiert.

Fortschrittsbalken zur Schwelle

Unabhängig von der gewählten Darstellung lässt sich in den Modi „Wie der Shop“ und „Eigene Farben“ zusätzlich ein Fortschrittsbalken zur Gratisversand-Schwelle einblenden (Einstellung „Fortschrittsbalken zur Schwelle“, Standard: Nein). Die Design-Vorlage „Fortschritt“ bringt ihren Balken unabhängig davon immer mit. Der Balken gilt sowohl auf der Artikelseite als auch – falls aktiviert – im Warenkorb.

Platzierung

Über CSS-Selektor und Platzierungsmethode wird festgelegt, wo auf der Artikelseite der Hinweis erscheint. Der Selektor benennt ein vorhandenes Element der Seite; die Methode legt fest, ob der Hinweis davor, dahinter, am Anfang oder am Ende dieses Elements eingefügt wird.

Für den Kostenloser-Versand-Hinweis zusätzlich, wenn „Auch im Warenkorb anzeigen“ aktiv ist:

Passt der Selektor auf kein Element der Seite, erscheint schlicht nichts – es entsteht kein Fehler. Welches Element beim eigenen Template passt, lässt sich im Browser per Rechtsklick → „Untersuchen“ auf die gewünschte Stelle herausfinden.

Support

Bei Fragen erreichen Sie uns über das Kontaktformular auf salepix.de. Bitte nennen Sie die Plugin-Version und Ihre JTL-Shop-Version.