WP Grundlagen – WordPress Farben

Im oberen Bereich (hier mit dem Transparent-Pattern dargestellt) wird die Farbauswahl getroffen. 

Das Feld darunter zeigt, solange keine Farbe gewählt wurde, No color selected an. Sobald eine Farbe gewählt wurde können hier die Farbwerte abgelesen werden bzw. wird hier der Name der Farbe - wenn es eine Theme-Farbe ist - angezeigt.

Die Kreise mit den Farbfeldern darunter zeigen die Farben des gewählten Stils im aktuellen Theme an. Die Anzahl dieser voreingestellten Farben ist je nach Stil unterschiedlich.

Die Funktion Leeren löscht eine getroffene Farbwahl.

Durch klicken in das Farbfeld oder verschieben des weissen Kreises weg von Links oben (weiss) wird die Farbwahl eingeleitet. Das Farbquadrat  zeigt oben links weiss, unten links und rechts schwarz und oben rechts jene Grundfarbe, die im ersten der beiden Schiebereglern ausgewählt ist (default rot). 

Durch Verschieben des Anfassers im Schieberegler über den Grundfarbenverlauf wird das Farbfeld verändert.

Der zweite Schieberegler ist für die Alphawerte zuständig, wird er von der Grundeinstellung rechts (=voll Deckend, 100) nach links bewegt wird zusätzlich zum Farbwert noch eine Alphawert im Farbcode ergänzt. Dadurch entsteht eine durchscheinende Farbe (Semitransparenz) die mit der Farbe des darunter liegenden Blocks reagiert. 

WordPress bietet 3 Farbwert-Codierungen an: Hex, HSL und RGB. Je nach gewähltem Modell tauchen zu den einzelnen Werten Schieberegler und Eingabefelder auf. 

Das Icon Rechts erlaubt das einfache Kopieren des Farbwertes in die Zwischenablage.

Wenn möglich wird die Option Verlauf angeboten. Damit kann man 2 Farben definieren, zwischen denen der Verlauf generiert wird. Statt einem gibt es jetzt 2 weisse Kreise, die zur Definition von Start- und Endwert benötigt werden. Das Festlegen der beiden Farben funktioniert analog wie oben.

Hat man diese beiden Werte definiert, kann der Typ des Verlaufs festgelegt werden. 

Belässt man die Voreinstellung Linear wird dieser im angegeben Winkel gezeichnet. Dieser kann numerisch oder über den Steuerkreis rechts angegeben werden.

Der Typ Radial lässt keine weiteren Einstellungen zu.

Auch bei den Verläufen kann es Definitionen aus dem Theme geben, die hier angezeigt werden und gewählt werden können. 

Der Abstand der beiden weissen Kreise im Farbfeld bestimmt, wie weit der Volltonwert angezeigt wird und wo der Übergang zur zweiten Farbe beginnt. 

Das Stilbuch ist eine Sammlung von 5 Bereichen: Text, Medien, Design, Widgets, Theme. Damit erhält man eine kompakte Vorschau, wie denn die eigentlichen Inhalte, Überschriften etc. mit dem jeweilig genutzten Stil aussehen.

Wenn man im Stil-Editor gelandet ist kann man aus den 3 Bereichen Typographie, Farben und Layout wählen. 

WordPress nennt diese Sammlungen von Farben Farbpaletten. In der Default-Einstellungen ist bei Twenty Twenty-Four (TT4) der Stil Standard mit 10 Farben eingestellt. 

Über die Palette lassen sich nun die Grundfarben ändern und weitere Farben dem Stil hinzufügen. 

Farbe darunter zeigt nun wo diese Farben bestimmten Anwendungen zugeordnet wurden: Text, Hintergrund, Link, Beschriftungen, Button und Überschrift. Manchmal ist ein Farbkreis angezeigt, manchmal auch 2 oder 3, wenn es zusätzliche Möglichkeiten der Anzeige gibt wie zB. Hover (Bei Mauszeigerkontakt) oder Aktiv. 

Neben dem Titel Farbe gibt es auch das Icon (2 vertikale Punkte) das zu den Farbe-Optionen führt. Damit lassen sich zusätzlich zu den 6 oben angeführten Anwendungen weitere der Liste hinzufügen, bei den Farben sind das H1 bis H6. 

Praktisch bedeutet das, dass man zuvor zB. für Überschriften eine Farbe für den Standard und eine zweite für den Mauskontakt (Hover) einstellt, zusätzlich aber über die Optionen die H3 mit einer anderen Farbe als die anderen Überschriften definieren kann.