WordPress Twenty Fourteen in F A R B E. – so perfekt

Der Classic-Editor: Vertraut und zuverlässig –
Ihr bewährter Begleiter. Info

Erleben Sie den Classic Editor neu!
(Bilder von pixelcreatures)

Viele Nutzer schätzen die vertraute Umgebung des Classic-Editors, die eine einfache und schnelle Bearbeitung ermöglicht.

Mit dem Advanced Editor Tools auf das nächste Level –
Mehr Funktionen, mehr Möglichkeiten.

Classic Editor + Advanced Editor Tools
= Ihr Erfolgsrezept

Der Advanced Editor erweitert den Funktionsumfang des Classic-Editors und ermöglicht es, Inhalte noch effektiver zu bearbeiten.

Einfach und intuitiv –
Der Classic-Editor für alle. Info

Classic Editor & Advanced Editor Tools
Erleben Sie es.

Der Classic-Editor zeichnet sich durch Stabilität und Zuverlässigkeit aus, was für professionellen Anwender von Bedeutung ist.

Mehr schaffen in weniger Zeit –
Der Advanced Editor für kreative Köpfe.

Optimieren Sie Ihre Bearbeitung:
Advanced Editor Tools

Mit dem Advanced Editor können Designer und
Content Creatoren kreative Ideen umsetzten.

Dem WordPress Twenty Fourteen Theme sind über Customizer zwei Farbwähler. Das ist für die Farbe des Titels der Website und die Hintergrundfarbe, welche auf größeren Bildschirmen sichtbar ist. Weiter gibt es das Plug-in 'Fourteen Colors' und hiermit sind dem Theme ganz einfach andere Farben zu geben. Das Drumherum ist hier kurz erläutert. Also das Farbschema der Website anpassen. So perfekt wie selbst gemacht.

Inhaltsverzeichnis

Plug-in Fourteen Colors

Der Installierung und Aktivierung des Plug-ins Fourteen Colors siehe dann Dashboard / Design / Customizer → „Farbe".

Nun erst mal der Unterscheidung, das ohne und mit dem Plug-in 'Fourteen Colors'. Links des Bilds wie von Haus aus ist und rechts mit Plug-in Fourteen Colors.

Twenty Fourteen Theme sind im Grunde zwei Farbwähler

Dazu dann Akzentfarbe und Kontrastfarbe und resultierend auch Farbe des Titels der Website

Im Bild ist zu sehen, dass in Aktivierung des Plug-ins nicht mehr die Auswahl zur 'Farbe des Titels der Website'. Jedoch sind dann Akzentfarbe, Kontrastfarbe und gleich wie ohne den Plug-in die Hintergrundfarbe. Das ohne 'Farbe der Website Titel ist aber gegeben, da sich durch die Kontrastfarbe die Textfarbe des Webseitentitels und der Widgets ergibt.

Die Akzentfarbe ist das für die Links, Suchmaske und der Text-Auswahl.
Die Kontrastfarbe, das sind die Farben von Kopf und linke Seitenleiste, der Body. So der Kontrastfarbe folgt die Textfarbe vom Titel der Website und der Widgets.
Das mit der Hintergrundfarbe ist dann ein Teil des Designs direkt vom Theme.

Text-Auswahl / Markierungsfarbe

Die Auswahl von Text ist gemeint, um das dann zu kopieren oder sich vorlesen zu lassen.

Wenn die Text-Auswahl / Markierungsfarbe anders sein soll, wie es sich ergibt, so ist im Customizer oder des Childs-Theme style.css das anzupassen.

Farbe von markiertem Text mit CSS anpassen.

::selection {background: #88b9b9; color: #ffffff;}
::-moz-selection {background: #88b9b9; color: #ffffff;}

Weiteres zur Nachlese im Titel Farben für das WordPress Theme “Twenty Fourteen” anpassen.

Etwas Fachsimpel

Hat sich das Farbschema der Website gefestigt, könnte man über die HTML-Ansicht der Website alleinig die Inline-CSS-Codes herausnehmen. Also die Inline-CSS-Codes resultierend aus dem Plug-in "Fourteen Colors" sind so aus dem Seitenquelltext (Maustaste rechts und Seitenquelltext anzeigen) zu kopieren. Das ist im Customizer oder besser im Childs-Themes style.css abzuspeichern.

Über Customizer folgen die CSS-Codes auch Inline, also im Seitenquelltext sichtbar. Oder der Variation über Childs-Theme, das wird aus der Datei abgerufen und in den Browser übertragen. Hiermit von einer Variation ist das Plug-in "Fourteen Colors" hinfällig, deaktiviert und gelöscht sein kann. Aber das von Inline usw. wird normalerweise über das Plug-in Autoptimize gesteuert.

Anmerkung: Die Codes aus dem Inline-CSS kopieren und direkt in die Theme style.css anfügen funktioniert, nicht. Hierzu müsste man sich die Mühe geben, allesamt Auszeichnungen direkt im Theme zu ändern.