Navigation

ThemeWare® Wissensdatenbank

Farben konfigurieren

In diesem Artikel erfährst du, wie du die Farben in deinem Shop konfigurierst.

Farben kannst du in verschiedenen Bereichen konfigurieren:

  • Theme-Konfiguration
  • Erlebniswelten
  • jegliche HTML-Elemente (Inline-Styles)
  • Shopware Core (sehr wenige, nicht für die Gestaltung relevant)

Nachfolgend zeigen wir dir wie du die Hauptfarben in der Theme-Konfiguration an deine Wünsche anpassen kannst, stellen dir das Farbkonfigurationsfeld vor und zeigen dir mögliche Konfigurationswerte.

Beispiel

Wahrscheinlich möchtest du als erstes die Primärfarbe an dein Corporate-Design anpassen.

  1. Öffne die Administration deines Shops
  2. Wechsel über die Hauptnavigation in die "Theme-Verwaltung" (1) (2) ("Inhalte" => "Themes")
    • Hinweis: In der Shopware Cloud findest du den Bereich "Themes" direkt in der Hauptnavigation.
  3. Klicke nun auf dein ThemeWare® Theme um die Bearbeitung zu beginnen
  4. Wechsel in den Tab "Layout" (3)
  5. Öffne den Bereich "Hauptfarben" (4)
  6. Als "Primärfarbe" (5) wählen wir den Wert #0e8ed3
  7. Im Feld Primärfarbe (hell) wählen wir die Nuance #6ac5f5
  8. Als Primärfarbe (dunkel) wählen wir #0c7ebb
  9. Speicher die Theme-Konfiguration
  10. Wechsel in die Storefront und lade die Seite einmal neu

Du hast nun erfolgreich die Primärfarbe geändert.

Screenshots

ThemeWare® Hauptfarben

TemeWare® Strong - Orange ThemeWare® Strong - Blau

Hinweis: Die Farbe vom Logo oder Design-Elementen in Bannern der Erlebniswelt ändert sich dadurch nicht. Dies sind Grafiken die nicht vom Browser umgefärbt werden können. Du kannst aber alle Grafiken im PSD-Format über die ThemeWare® Utilities herunterladen und diese beliebig anpassen.


Weiterführende Informationen

  • Grundwissen: Mehr Informationen zum Thema "Farbkonfiguration" findest du im Artikel Farbkonfiguration.

ThemeWare® Video-Tutorial

https://service.themeware.design/themeware-tutorial

ThemeWare® Video-Tutorial

Zuletzt aktualisiert am

Diese Seite im Netz: /wiki/wissensdatenbank/einfuehrung/farben-konfigurieren · ThemeWare® Service Portal, service.themeware.design