Hintergrundfarbe des Headers bei Block Themes ändern

Änderung der Hintergrundfarbe des Headers bei Block Themes

Bei Block Themes ist häufig die Hintergrundfarbe des Headers zunächst transparent. Diese Hintergrundfarbe kann recht einfach über die Einstellungen beim Website-Editor geändert werden. Wie das funktioniert, beschreibe ich in dem folgenden kurzen Beitrag.

Bei Block Themes kann man die Farbe für den Hintergrund recht einfach über Design > Website-Editor ändern. Dazu muss man bei der umschließenden Gruppe eine andere Hintergrundfarbe wählen. Entweder wählt man die Farbe aus den Stilen für die Gruppe aus oder wählt eine Hintergrundfarbe aus dem Farbschema.

Hier ein Video zur Änderung der Hintergrundfarbe bei Twenty Twenty-Five über die Stile der Gruppe:

Nachfolgend zeige ich, wie man die Farbe für den Hintergrund bei der umschließenden Gruppe über die Farbauswahl aus dem Farbschema vornimmt:

Bei allen Block Themes ist die letztgenannte Option auf jeden Fall immer möglich. Die Änderung über die Stile steht nur zur Verfügung, falls die Entwickler des jeweiligen Block Themes entsprechende Stile für die Gruppe anbieten.

Änderungen durch Auswahl einer eigenen Farbe, die nicht im Farbschema enthalten ist, ist in der Regel nicht empfehlenswert, weil die Farben im Farbschema aufeinander abgestimmt sind.

Zum Headerbild dieses Beitrags: Bei dieser Website haben wir das Theme Twenty Twenty-Five verwendet. Die Hintergrundfarbe haben wir auf weiß geändert, damit der Sticky Header nicht transparent ist. Bei Verwendung eines Sticky Headers z. B. mit unserem Plugin Dynamic Header & Navigation for Block Themes würde sonst der Content (Inhalt der jeweiligen Seite) den Header überdecken. Aber auch bei der Erstellung des Sticky Headers mit Bordmitteln sollte die Hintergrundfarbe geändert werden.

Links

• Plugin Dynamic Header & Navigation for Block Themes
• Erstellung eines Sticky Headers mit Bordmitteln

Weitere Beiträge zum Thema (Block Neueste Beiträge)

• learn-wp-dach.org: Hilfe bei der Erstellung der ersten eigenen Website
• WordCamp Mannheim 2026: Warum ich dabei bin
• News aus dem WordPress-Universum – 6/2026
• Navigation Overlay in WordPress 7.0
• Revisionen in WordPress 7.0

Wir freuen uns über eine Kontaktaufnahme

Was hältst du davon?

Wir hoffen, dieser Beitrag hat dir gefallen und wir würden uns über einen Kommentar freuen. Auch über Erweiterungen, Korrekturen, Hinweise oder sonstige Anmerkungen freuen wir uns sehr.

Du kennst unseren Newsletter noch nicht? – Hier findest du eine Übersicht über die bisher versendeten Newsletter. Wenn du keine neuen Beiträge und WordPress-News verpassen möchtest, melde dich jetzt kostenlos für unseren Newsletter an. Den Newsletter bekommst du dann einmal am Anfang des Monats.

Blog: Auf der folgenden Seite findest du weitere interessante Beiträge sortiert nach Kategorien und Schlagwörtern.