Theme-Editor

Der Theme-Editor bestimmt das grundlegende Erscheinungsbild Ihres Shops: Farben, Schriftarten, Abstände, Eckenradien und Button-Stile. Änderungen hier wirken sich auf den gesamten Shop aus – im Unterschied zu einzelnen CMS-Seiten, die nur ihren eigenen Inhalt betreffen.

Was kann ich hier tun?

Eine fertige Design-Vorlage (Preset) auswählen und aktivieren
Farben für Primär-, Sekundär- und weitere Elemente festlegen
Schriftart, Schriftgröße, Zeilenhöhe und Überschrift-Stärke einstellen
Abstände (Container-Breite, Section-, Card- und Grid-Abstand) anpassen
Eckenradien und Randbreiten festlegen
Eigenes CSS für tiefergehende Anpassungen hinterlegen
Änderungen in einer Live-Vorschau prüfen, bevor sie gespeichert werden

Schritt für Schritt

Vorlage wählen: Klicken Sie in der Vorlagen-Galerie auf eine der fünf Design-Vorlagen (Minimalist, Fashion, Electronics, Food & Drink, Luxury), um sie zu aktivieren.
Feineinstellungen vornehmen: Wechseln Sie zwischen den Reitern "Farben", "Typografie", "Abstände", "Ränder" und "Custom CSS", um einzelne Werte anzupassen.
Vorschau prüfen: Beobachten Sie den Live-Vorschau-Bereich rechts, der Überschrift, Text, eine Beispiel-Karte und Buttons in den aktuell gewählten Einstellungen zeigt.
Speichern: Klicken Sie auf "Änderungen speichern". Über "Zurücksetzen" verwerfen Sie nicht gespeicherte Änderungen und kehren zum zuletzt gespeicherten Stand zurück.

Felder erklärt

Feld	Bedeutung	Hinweise/Auswirkung
Farben (Primary, Secondary, Accent, Background, Surface, Text, Text Secondary, Error, Success, Warning, Border)	Die Farbpalette des Shops	Wirken sich auf Buttons, Hintergründe, Status-Meldungen usw. aus
Schriftart / Überschrift-Schrift	Verwendete Google-Schriftarten für Fließtext bzw. Überschriften	Auswahl aus einer festen Liste gängiger Schriftarten; die Liste hat ein Suchfeld, tippen Sie einfach den Namen der gewünschten Schrift
Schriftgröße	Basis-Schriftgröße in Pixel	Beeinflusst die Lesbarkeit im gesamten Shop
Zeilenhöhe	Abstand zwischen Textzeilen	Wirkt sich auf die Lesbarkeit längerer Texte aus
Überschrift-Stärke	Schriftstärke (Fettgrad) von Überschriften	Von dünn bis sehr fett
Container-Breite	Maximale Breite des Hauptinhalts	Bestimmt, wie breit sich Seiteninhalte ausdehnen
Section-/Card-/Grid-Abstand	Innen- bzw. Außenabstände zwischen Elementen	Beeinflusst die Großzügigkeit des Layouts
Eckenradius	Rundung von Ecken (z. B. bei Karten, Buttons)	Kleinere Werte wirken kantiger, größere runder
Randbreite	Dicke von Rahmenlinien	Wirkt sich auf Karten- und Eingabefeld-Rahmen aus
Custom CSS	Frei einsetzbarer, zusätzlicher Gestaltungscode	Nur für erfahrene Nutzer, überschreibt Standardwerte

Werte & Status

Design-Vorlagen (Presets)

Wert	Klartext-Bedeutung
Minimalist	Schlichte, moderne Vorlage mit indigo-blauem Akzent
Fashion	Elegante Vorlage mit dunklem Grundton und pinkfarbenem Akzent, serifenbetonte Überschriften
Electronics	Technisch-kühle Vorlage mit dunkelblauem Grundton und hellblauem Akzent
Food & Drink	Warme Vorlage mit Brauntönen und orangefarbenem Akzent, abgerundete Ecken
Luxury	Dunkles, edles Design mit goldfarbenem Akzent und serifenbetonten Überschriften

Häufige Fragen

Wie ändere ich schnell das gesamte Erscheinungsbild meines Shops?
Wählen Sie in der Vorlagen-Galerie eine der fünf Design-Vorlagen aus – Farben, Schriften und Abstände werden automatisch übernommen.

Ich habe Änderungen vorgenommen, sehe sie aber noch nicht im Shop. Woran liegt das?
Klicken Sie auf "Änderungen speichern". Nicht gespeicherte Änderungen sind nur in der Vorschau sichtbar.

Wie mache ich meine Änderungen rückgängig?
Solange Sie noch nicht gespeichert haben, klicken Sie auf "Zurücksetzen", um zum zuletzt gespeicherten Stand zurückzukehren.

Was ist der Unterschied zwischen dem Theme-Editor und "Vorlage anpassen"?
Der Theme-Editor legt globale Design-Grundwerte (Farben, Schriften, Abstände) fest, die im ganzen Shop gelten. Über Vorlagen anpassen gestalten Sie zusätzlich den konkreten Seitenaufbau (Kopf-/Fußbereich, Sektionen je Seitentyp).

Wofür ist das Feld "Custom CSS" gedacht?
Für zusätzliche, gezielte Gestaltungsanpassungen, die über die Standardoptionen hinausgehen. Es richtet sich an Nutzer mit CSS-Kenntnissen.

Wo genau wirken die Theme-Werte im Shop?
Auf allen Bedienelementen des Shops, ohne Ausnahme. Schaltflächen in der Ausprägung „primär“ tragen Ihre Primärfarbe, Ihren Eckenradius, Ihre Schriftstärke und Ihre Textumwandlung; die sekundären Schaltflächen tragen zusätzlich Ihre Randfarbe. Eingabefelder - Anmeldung, Konto, Kasse, Newsletter, Rücksendungen - tragen Ihre Randfarbe, Ihren Eckenradius und Ihre Primärfarbe als Fokusring. Sie müssen dafür nichts einstellen: Es genügt, die Werte im Theme-Editor zu speichern.

Ich habe keine eigene Farbe hinterlegt. Was sieht mein Kunde dann?
Die Standardwerte der gewählten Design-Vorlage. Es bleibt nie ein Element ohne Farbe oder ohne Rahmen zurück; ein nicht gesetzter Wert fällt immer auf den Vorlagenwert zurück.

Die Bedienelemente sehen seit dem letzten Update etwas anders aus. Ist das Absicht?
Ja, in kleinem Umfang. Schaltflächen und Eingabefelder folgen jetzt einer einheitlichen Höhenskala (44 Pixel für die großen Bedienelemente, 36 Pixel für die kleinen) statt einer aus dem Inhalt abgeleiteten Höhe. Farbe, Eckenradius, Schriftstärke und Textumwandlung sind unverändert und kommen weiterhin aus Ihrem Theme.