Zum Inhalt springen
Themen

Checkout-Branding

Passen Sie das Aussehen Ihres Checkouts an – Logo, Farben, Schriften und Formen – ohne Preise, Steuern oder Versand zu berühren.

Mit dem Checkout-Branding passen Sie an, wie Ihr Checkout aussieht – Logo, Farben, Schriften und Formen. Preise, Steuern oder Versand werden dadurch nicht beeinflusst; diese werden an anderer Stelle konfiguriert.

Checkout-Branding öffnen

Gehen Sie zu Shop → Konfiguration → Checkout-Branding.

Der Bildschirm Checkout-Branding mit dem Editor links und der Live-Vorschau rechts.
Der Bildschirm Checkout-Branding mit dem Editor links und der Live-Vorschau rechts.

Aktivieren Sie oben im Formular Checkout-Branding aktivieren. Schalten Sie es jederzeit wieder aus, um zum Standard-Theme zurückzukehren – Ihre gespeicherten Einstellungen bleiben erhalten, sie werden nur nicht mehr angewendet.

Markenelemente hochladen

Unter Markenelemente:

  • Logo – laden Sie ein Bild hoch, das im Checkout-Header anstelle des Store-Namens angezeigt wird.
  • Favicon – laden Sie das kleine Symbol hoch, das während des Checkouts im Browser-Tab erscheint.
  • Logo-Position – legen Sie fest, wo das Logo im Header steht.
  • Logo max. Breite – ziehen Sie den Regler (40–400px), um die Logogrösse festzulegen.

Farben festlegen

Legen Sie unter Farben für jedes Element einen Hex-Wert (#RRGGBB) fest – Primärfarbe (Buttons), Text auf Primärfarbe, Akzent, Hintergrund, Hintergrund der Bestellübersicht, Fläche (Karten), Text, gedämpfter Text, Fehler, Erfolg, Rahmen/Trennlinien, Rahmen der Eingabefelder und Fokusrahmen. Nutzen Sie das Farbfeld neben jedem Eintrag, um die Farbe visuell auszuwählen, oder geben Sie den Hex-Code direkt ein.

Schrift und Form festlegen

Unter Schrift & Form:

  • Schrift (Text) und Schrift (Überschriften) – wählen Sie aus den verfügbaren Web-Schriften.
  • Eckenradius – die Standard-Rundung (0–24px) für Karten und andere Elemente.
  • Button-Text in Grossbuchstaben – schreibt den gesamten Button-Text in Grossbuchstaben.
  • Radius-Override Buttons / Radius-Override Eingabefelder – legen Sie eine abweichende Rundung nur für Buttons oder Eingabefelder fest; leer lassen, um den Eckenradius oben zu übernehmen.
  • Button-Stil und Feld-Stil – wählen Sie das visuelle Erscheinungsbild für Buttons und Eingabefelder.

Header, Footer und Vertrauenselemente festlegen

Unter Header, Footer & Vertrauen:

  • Ankündigungstext – eine Meldung, die in einer Leiste über dem Checkout angezeigt wird, in der aktuellen Sprache. Leer lassen, um die Leiste auszublenden.
  • Hintergrundfarbe / Textfarbe der Ankündigung – die Farben für diese Leiste.
  • Footer anzeigen – zeigt den Store-Namen und Links zu Richtlinien im Checkout-Footer an.
  • Vertrauenssiegel anzeigen – zeigt Vertrauens- und Zahlungssiegel an.

Vorschau und Speichern

Jede Änderung aktualisiert sofort die Live-Vorschau rechts, sodass Sie das Ergebnis vor dem Speichern prüfen können. Sobald Sie zufrieden sind, klicken Sie auf Speichern.

Die Live-Vorschau reagiert auf eine Farb- und Schriftänderung.
Die Live-Vorschau reagiert auf eine Farb- und Schriftänderung.

War dieser Artikel hilfreich?