Erweiterung

Farbwähler

Fügt ein Farbwähler-Feld-Widget für editorfreundliche visuelle Konfiguration in EmDash CMS hinzu.

• Kategorie: Editor-Erfahrung
• Status: Verfügbar
• Version: In der Beta enthalten
• Preis: In der Beta enthalten

Link kopieren In Claude öffnen In ChatGPT öffnen

Auf X teilen Auf LinkedIn teilen Auf Reddit teilen

Produktdetails

Kategorie

Editor-Erfahrung

Status

Verfügbar

Version

In der Beta enthalten

Color Picker ist ein fokussiertes Editor-Experience-Plugin: Es ergänzt ein Farbwähler-Feld-Widget, damit Admins Markenfarben visuell konfigurieren können statt Hex-Codes in Klartextfelder zu tippen. Es zeigt, dass EmDash-Plugins nicht nur für schwere Integrationen da sind — sie verbessern auch den Alltag beim Bearbeiten. Siehe packages/plugins/color im EmDash-Repository.

Installation

1. Aktivieren Sie das Color-Picker-Plugin im EmDash-Admin.
2. Hängen Sie im Inhaltsmodell oder Schema das Farb-Widget an die Felder, in denen Designer Farben wählen sollen (Akzente, Button-Farben, Kategorie-Badges).
3. Prüfen Sie die Admin-UI in der Vorschau, ob der Picker rendert und Werte beim Speichern persistiert.

Konfiguration

Üblicherweise definieren Sie:

• Standardfarben — markensichere Startwerte für neue Einträge.
• Erlaubte Formate — Hex, RGB oder CSS-Variablen, je nachdem, was Ihr Theme verarbeitet.
• Kontrast- oder Barrierefreiheitshinweise — manche Teams ergänzen Feldbeschreibungen, wenn Farben gegen bekannte Hintergründe WCAG-Kontrast erfüllen müssen.

Beispiel (konzeptionell): Eine Marketing-Vorlage speichert primaryColor und secondaryColor als #2563eb und #64748b, referenziert in Astro-Komponenten über CSS-Variablen zur Build-Zeit.

Einsatzszenarien

• Theme-Anpassung — Marketing-Sites, bei denen jede Kampagne einen leicht anderen Akzent braucht ohne neues Deployment.
• Designsysteme — Palettenwahl in strukturierten Feldern statt verstreuter Inline-Styles.
• White-Label-Produkte — Partner wählen Farben innerhalb Ihrer Vorgaben.

Betriebshinweise

• Dokumentieren Sie, wie Farben auf Frontend-Tokens abbilden, damit Entwickler nicht doppelt hardcoden.
• Validieren Sie Werte beim Speichern, wenn z. B. knallige Grüntöne auf einer Healthcare-Marke tabu sind.
• Beim Content-Export Farbfelder einschließen, damit Re-Imports kein Styling verlieren.