Content ist nicht alles – auch das Auge möchte verwöhnt werden. Sie haben sich für WordPress entschieden und möchten sich mit einem frischen Look von der Konkurrenz abheben? Kein Problem. Und versprochen: Das funktioniert heute ganz unkompliziert ohne Eingabe von HTML- oder CSS-Code.

Wenn Sie ein Block-Theme im Einsatz haben, können Sie mit ein paar Klicks an der richtigen Stelle beliebige Farben in Ihre Überschriften bringen – und zwar getrennt für jede Überschriften-Ebene. Ein Beispiel:

Alle Überschriften der Ebene H2 werden rot angezeigt.
Alle Überschriften der Ebene H3 werden blau angezeigt.
Alle Überschriften der Ebene H4 werden grün angezeigt.

Natürlich möchten Sie nicht mühsam jede einzelne Überschrift bearbeiten, sondern sämtliche Farben für alle Ebenen an zentraler Stelle festlegen. Diese zentrale Stelle hat in WordPress einen Namen: das Stilbuch.

Der Weg zum Stilbuch

Der Weg ins Stilbuch führt über den Website-Editor. Natürlich müssen Sie im Backend eingeloggt sein, um dieses Tool zu nutzen. Sind Sie bereits in WordPress eingeloggt, dann klicken Sie zunächst in der schwarzen Menüleiste links auf: Design → Website-Editor

Im Website-Editor

Alte WordPress-Hasen kennen noch den Customizer, aber im Zeitalter der Blockthemes hat dieses Tool ausgedient. Der wesentlich leistungsfähigere Nachfolger nennt sich Website-Editor. Fünf Bereiche stehen dir dort zur Verfügung:

Navigation
Stile
Seiten
Templates
Vorlagen

Aus diesen fünf Bereichen wählen Sie nun Stile aus.

Den Stil bearbeiten

Den Stil eines WordPress-Themes zu betrachten, ist zwar auch ganz nett, aber wir sind hier ja nicht im Museum. Der Stil sollte jetzt nach Ihren Wünschen angepasst werden. Klicken Sie dazu auf das Icon mit dem Stift.

Im Stilbuch die Farben auswählen

Auf dem nächsten Bildschirm finden Sie in der rechten Seitenleiste verschiedene Möglichkeiten zur Anpassung des Stils:

Typografie
Farben
Hintergrund
Schatten
Layout

Weiter geht es jetzt mit einem Klick auf Farben. Dort, und nicht in der Rubrik Typografie, werden auch die Farben für die Überschriften definiert.

Das richtige Element auswählen

Jetzt sind Sie in der Farbenabteilung des Stilbuchs angelangt. Aber WordPress weiß noch nicht so ganz genau, welche Elemente Ihrer Website Sie konkret bearbeiten möchten. So geht es weiter:

Klicken Sie auf das Icon mit den drei senkrechten Punkten rechts neben Elemente.
Aktivieren Sie den Haken bei Überschrift.
Nun werden Ihnen die Überschriften-Ebenen H1 bis H6 angezeigt.

Überschriften im Internet: Von H1 bis H6

Bevor es an die Änderung der Farben geht, zunächst noch ein kleiner Theorie-Teil:

In HTML, der Sprache des Internets, werden sechs verschiedene Überschrifts-Ebenen unterschieden. H1 (Heading 1) steht dabei für die erste, H6 für die letzte Ebene. Die Ebene H1 wird von WordPress automatisch für den Titel einer Seite oder eines Blogbeitrags vergeben. Um Google nicht zu verwirren, sollten Sie die H1-Ebene auch nur ein einziges Mal pro Seite oder Blogbeitrag verwenden.

H2-Überschriften werden von den meisten Admins am häufigsten verwendet, Überschriften der Ebenen H3 und H4 etwas seltener. Eine Gliederung bis in die Ebenen H5 und H6 ist bei sehr langen Texten hilfreich. Sie wollen bei Ihrer Leserschaft und besonders bei Google mal so richtig punkten? Dann schreiben Sie ausführliche Texte für die thematische Nische Ihrer Website und schöpfen Sie die Ebenen voll aus. Mit der Farbdefinition beginnen sollten Sie dann bei der Ebene H2.

Eine Überschriften-Ebene auswählen

Im Beispiel wurde bei Überschrift die Ebene H2 ausgewählt. In der rechten Spalte sind nun zwei Farbkreise eingeblendet. Der erste Kreis steht für die Farbe aller H2-Überschriften, der zweite für den Hintergrund aller H2-Überschriften.

Zur Bearbeitung klicken Sie einfach auf einen der beiden Kreise.

Die Farbe auswählen

Im nächsten Fenster können Sie dann nicht nur die Textfarbe, sondern auch die Hintergrundfarbe der ausgewählten Überschrifts-Ebene ändern. Im Beispiel wurde die Ebene H2 ausgewählt. Folgende Möglichkeiten stehen zur Verfügung:

Text: Hier ändern Sie die Textfarbe aller Überschriften der Ebene H2.
Hintergrund: Hier ändern Sie die Hintergrundfarbe aller Überschriften der Ebene H2.
Verlauf: Hier legen Sie einen Farbverlauf für alle Überschriften der Ebene H2 an. Mit diesem Feature sollten Sie eher vorsichtig umgehen, wenn Ihre Website keinen kitschigen Eindruck hinterlassen soll. Verwenden Sie, damit die Lesbarkeit der Überschriften nicht allzu sehr leidet, in jedem Fall einen starken Kontrast zwischen der Textfarbe im Vordergrund und dem Farbverlauf im Hintergrund.

Das Ergebnis überprüfen

Wenn Sie das Stilbuch und den Website-Editor wieder verlassen, sehen Sie das Ergebnis sofort:

Alle H2-Überschriften haben – wie im Stilbuch definiert – automatisch die neue Farbe übernommen.

Ihre nächsten Schritte könnten sein:

Sind Sie mit der neuen H2-Farbe zufrieden? Dann bearbeiten Sie auch die weiteren Ebenen, die Sie auf Ihrer Website verwenden. Probieren Sie beispielsweise dezente Farbnuancen für H3 und H4 aus.
Sind Sie mit der neuen H2-Farbe unzufrieden? Dann gehen Sie zurück ins Stilbuch und ändern den Farbton.
Möchten Sie die neue Farbe zwar für die meisten, aber nicht für alle H2-Überschriften verwenden? Kein Problem: Beim Bearbeiten einzelner Seiten oder Beiträge können Sie die im Stilbuch definierten Farben lokal überschreiben.

Fazit – Farbe der WordPress-Überschriften anpassen

Die Zeiten haben sich geändert. Früher war in WordPress viel Handarbeit nötig, um das Design anzupassen. Heute lässt sich das meiste ganz ohne CSS-Code erledigen.

Der Website-Editor und das Stilbuch machen es möglich. Mit feinen Farbakzenten erhält Ihre Website einen frischen Look.

Längere Texte lassen sich mit Überschriften und Zwischenüberschriften übersichtlich strukturieren. Davon profitieren nicht nur Ihre Leserinnen und Leser, sondern auch Suchmaschinen.

SEO-Effekt 1: Eine klare Struktur verbessert die Verständlichkeit Ihrer Inhalte.
SEO-Effekt 2: Google misst die Aufenthaltsdauer der Seitenbesucher. Je länger diese auf Ihrer Seite bleiben, desto besser.

Es lohnt sich also, Website-Texte sinnvoll zu gliedern und die verschiedenen Überschriften-Ebenen über das Stilbuch auch optisch hervorzuheben.

Aber Vorsicht: Die vielfältigen Möglichkeiten des Stilbuchs können dazu verleiten, es mit Farben zu übertreiben. Die Kunst besteht darin, dezente Farbnuancen einzusetzen.

Ihre Besucherinnen und Besucher werden es zu schätzen wissen.

Bild von Gerd Altmann auf Pixabay