Farben und Schriften

Farben und Schriften stellst du einmal für die ganze Website ein, nicht Seite für Seite. Das Theme liest sie von dort. Ändert sich dort etwas, ändert es sich überall: Knöpfe, Überschriften, Abschnitte, Karten, Kopf und Fuß, auch die Blöcke von WP Club Elements.

Die Stile öffnen

1. Klick im Menü links auf „Design“ und dann auf „Editor“. Das ist der Website-Editor.
2. Klick links auf „Stile“.

Die Seitenleiste „Stile“ im Website-Editor.

Oben siehst du eine Vorschau mit „Aa“ und zwei Farbpunkten, darunter „Stile durchstöbern“, „Typografie“, „Farben“, „Hintergrund“, „Schatten“ und „Layout“. Rechts zeigt der Editor deine Startseite, sodass du jede Änderung sofort siehst.

Erst Speichern, dann gilt es

Was du im Website-Editor änderst, gilt erst, wenn du es speicherst. Solange nichts geändert ist, steht unten links „Gespeichert“. Sobald du etwas änderst, erscheint dort ein Hinweis auf die offenen Änderungen, zum Beispiel „1 Änderung überprüfen …“. Über diesen Hinweis speicherst du. Je nach Ansicht im Editor heißt der Knopf auch „Speichern“ und steht oben rechts. Verlässt du den Editor vorher, ist nichts passiert. Unten links steht außerdem „Revisionen“ mit der Zahl früherer Stände, zu denen du zurückkehren kannst.

Wie genau das Speichern in deiner Version von WordPress aussieht, hängt vom Editor ab. Diese Dokumentation beschreibt den Wortlaut, wie ihn der Editor im Moment zeigt. Probier es zuerst an einer unwichtigen Änderung aus.

Farben

Klick auf „Farben“. Der erste Abschnitt heißt „Palette“, mit dem Eintrag „Palette bearbeiten“. Das ist die Farbpalette der Website. Sie besteht aus sieben Farben, jede mit einer festen Aufgabe:

Die Palette: „Theme“ und „Individuell“ mit je sieben Farben, darunter fertige „Paletten“.

Name im Editor	Wofür sie da ist
Vereinsfarbe	die Farbe deines Vereins: Links, Knöpfe, Überzeilen, die kräftigen Abschnitte
Akzentfarbe	eine helle Zweitfarbe: der Knopf auf dunklem Grund, Akzente
Zweite Akzentfarbe (dunkel)	die dunklere Variante der Vereinsfarbe, zum Beispiel beim Darüberfahren mit der Maus
Fläche	der zweite, leicht abgesetzte Hintergrund
Hintergrund	der Hintergrund der Seiten, meist weiß
Text	die Farbe des Textes und der dunklen Abschnitte
Text, gedämpft	Bildunterschriften und Einleitungen

Unten stehen „Paletten“: sieben fertige Farbzusammenstellungen. Ein Klick darauf ersetzt die Farben. Das ist der einfachste Weg. Die Zusammenstellungen sind so gewählt, dass Text auf jedem Hintergrund gut lesbar bleibt.

Eine einzelne Farbe änderst du mit einem Klick auf den Farbpunkt. Wähle sie mit Bedacht: Helle Schrift auf hellem Grund liest niemand. Bleib bei der Vereinsfarbe am besten bei einer, die dunkel genug für weißen Text ist.

Hinweis

Im Demoverein stehen im Editor zwei Gruppen von Farben: „Theme“ mit den Farben des Themes und „Individuell“ mit den Farben des gewählten Stils. Die Farben des Stils tragen dort englische Namen („Primary“, „Secondary“ …). Gemeint sind dieselben sieben Aufgaben wie in der Tabelle.

Schriften

Klick auf „Typografie“. Du findest dort:

Der Abschnitt „Typografie“ mit „Schriftsätze“, „Schriften“ und „Elemente“.

• „Schriftsätze“: fertige Paarungen aus einer Schrift für Überschriften und einer für den Text. Ein Klick wendet sie an.
• „Schriften“ mit „Fließtext“ und „Überschriften“: die beiden Schriften der Website. Der Fließtext ist der Text, den man liest. Die Überschriften-Schrift ist die der Titel.
• „Elemente“: Text, Links, Überschriften, Beschriftungen und Buttons, je mit eigener Einstellung.

Ohne weitere Wahl nutzt das Theme Manrope für Überschriften und Inter für den Text. Zwei Schriften reichen. Mehr macht eine Seite unruhig.

Die Größen der Schrift sind festgelegt, damit alle Seiten gleich wirken. Du wählst sie im Editor aus einer kurzen Liste, nicht frei.

Was die Website daraus macht

Nach dem Speichern gelten die neuen Farben und Schriften auf allen Seiten, auch in Kopf, Fuß und in den Listen. Die Seiten selbst musst du nicht anfassen. Lade die Website zum Prüfen mit Strg + F5 neu.

Häufige Fragen

Ich habe etwas verstellt. Wie komme ich zurück? Hast du noch nicht gespeichert, verlass den Editor ohne Speichern. Hast du gespeichert, öffne unten links „Revisionen“ und wähle einen früheren Stand.

Soll ich lieber einen fertigen Stil nehmen? Meist ja. Ein Stil legt Farben, Schriften, Rundungen und mehr zusammen fest. Siehe Stilvarianten.

Wo ändere ich das Logo und den Namen im Kopf? In den Vereinsdaten, nicht hier.

Kann ich die Farben auch im Code festlegen? Ja, im Child-Theme. Das ist etwas für Agenturen. Siehe Farben, Schriften, Abstände.