Im Design-Editor kannst du das Erscheinungsbild deines Shops anpassen. Hier stehen dir verschiedene Styling-Optionen zur Verfügung, mit denen du sowohl einzelne Elemente als auch globale Designs gestalten kannst.
Basis-Einstellungen
Grundlegende Einstellungen sind über große, orange Buttons in der Übersicht erreichbar. Sie ermöglichen dir, das grundlegende Design deines Shops festzulegen, etwa Farbschema, Schriftarten oder das Definieren von einheitlichen Abständen.
Erweitert
Erweiterte Einstellungen sind komplexere Style-Einstellungen für Elemente und Teilbereiche deines Shops. Hier kannst du eigene Elemente anlegen und spezifische Bereiche anpassen und gestalten. Im Inhalts-Editor kannst du dann auf deine definierten Stile zugreifen.
Styling
Ein Klick auf ein Element in der Vorschau führt dich direkt zu den erweiterten Styling-Einstellungen dieses Elements.
Bei der Bearbeitung eines Elements kannst du auf einzelne Teilbereiche zugreifen. Sobald du einen Teilbereich ausgewählt hast, gelangst du zu detaillierten Styling-Einstellungen, um das Design nach deinen Wünschen anzupassen.
Teilbereiche - auch Style-Container genannt - vererben untereinander. Übergeordnete Container vererben ihre Stylings an untergeordnete Container. Das vererbte Design kann in den untergeordneten Containern überschrieben werden.
Falls dein Styling nicht wie erwartet angewendet wird, überprüfe die Überschreibungen – möglicherweise wird es von einer anderen Einstellung überschrieben!
Live-Vorschau
Die Live-Vorschau ermöglicht dir, Stylings in Echtzeit anzupassen. Layout-Einstellungen und andere Konfigurationen sind hier jedoch nicht verfügbar.
Bei Links und Buttons kannst du wählen, ob du das Styling bearbeiten oder die verlinkte Ansicht öffnen möchtest, um dich innerhalb der Seite zu bewegen. Handelt es sich um ein Inhaltseditor-Element, kannst du entscheiden, ob du das allgemeine Basis-Styling oder eine individuelle Anpassung vornehmen möchtest.
Um die Vorschau auf eine andere Bildschirmgröße umzustellen, nutze die Leiste oberhalb der Vorschau. Klicke einfach auf das Icon des gewünschten Geräts, um dessen Ansicht zu simulieren.