epilot Help Center
Meine Tickets

Dark Mode und mobile Darstellung

Mit dem Dark Mode können deine Kunden die Journey in einer dunklen Darstellung ausfüllen. Außerdem passen sich Journeys automatisch an Smartphones an.

Dieser Artikel zeigt dir, wie du den Dark Mode freischaltest und beide Darstellungen vor dem Veröffentlichen prüfst.


So funktioniert's

Den Dark Mode schaltest du pro Journey frei. Die Journey richtet sich dann nach der Einstellung des Geräts deiner Kunden. Zusätzlich erscheint oben in der Navigationsleiste ein Symbol, mit dem sie selbst zwischen hell und dunkel wechseln. Im Portal passt sich die Journey an die Darstellung des Portals an.

dm-02-hell-und-dunkel.png

Die Farben für den Dark Mode erzeugt epilot automatisch aus deinem Design. Du musst kein zweites Design anlegen.

Konfiguration

Dark Mode freischalten

1. Öffne deine Journey im Journey Builder und klicke oben auf Einstellungen.

2. Wähle links Design und aktiviere Dark Mode im Journey erlauben.

ds-01-journey-einstellungen-design.png

3. Klicke auf Speichern und schließen und danach auf Speichern.

Wichtig

Verwendet deine Journey ein Design mit Custom CSS, prüfe den Dark Mode gründlich. Eigene CSS-Regeln können die dunkle Darstellung überschreiben, zum Beispiel eine fest eingestellte weiße Hintergrundfarbe.

Dark Mode im Design Builder prüfen

4. Öffne dein Design unter Konfiguration > Designs und wähle unter Journey vorschau deine Journey.

5. Aktiviere Dark Mode vorschau und schalte über das Symbol in der Navigationsleiste der Vorschau auf dunkel.

dm-03-dark-mode-vorschau.png

Hinweis

Dark Mode vorschau ist nur eine Vorschau. Für deine Kunden freischalten kannst du den Dark Mode nur in den Journey-Einstellungen.

Mobile Darstellung prüfen

6. Klicke im Design Builder oben rechts auf das Smartphone-Symbol. Die Vorschau zeigt die Journey in Smartphone-Breite.

db-04-smartphone-vorschau.png

7. Blättere durch alle Schritte. Achte besonders auf lange Überschriften, Bilder und Auswahlkarten, die auf dem Smartphone untereinander stehen.

Tipp

Teste die Journey zusätzlich auf einem echten Smartphone. Öffne dazu im Journey Builder die veröffentlichte Version und schick dir den Link. Mehr dazu in Journey testen und veröffentlichen.

Häufige Fragen

Kann ich eigene Farben für den Dark Mode festlegen?

Nicht in den Design-Einstellungen. epilot leitet die dunklen Farben automatisch ab. Für Feinanpassungen nutzt du Custom CSS.

Was sehen meine Kunden, wenn der Dark Mode nicht freigeschaltet ist?

Immer die helle Darstellung, auch wenn ihr Gerät auf dunkel eingestellt ist.

Muss ich für Smartphones etwas einstellen?

Nein. Journeys passen sich automatisch an die Bildschirmbreite an. Bilder werden auf dem Smartphone immer in voller Breite angezeigt.

Weitere Artikel in diesem Abschnitt