Скачать или смотреть WP Design System – Header anpassen

In diesem Video lernst du, wie du den Header im WP Design System anpasst und konfigurierst. Du erfährst, wie Template Parts funktionieren, wie du zwischen verschiedenen Header-Patterns wechselst und deine Navigation einrichtest.

Was du lernst:
Wie Template Parts in WordPress funktionieren und wo du den Header findest
Wie du zwischen verschiedenen Header-Patterns wechselst (einfache Header und Multi-Level-Navigation)
Wie du ein Logo in den Header einfügst (PNG oder SVG)
Wie du eine eigene Navigation erstellst und anstelle der Demo-Navigation einbindest
Wie du Navigationslabels für Barrierefreiheit korrekt benennst
Wie Skiplinks funktionieren und warum sie wichtig sind

Template Parts und Header-Patterns:
Das WP Design System nutzt Template Parts für Header und Footer. Diese globalen Bereiche werden zentral verwaltet und erscheinen auf allen Seiten deiner Website. Das Parent Theme enthält einfache Header mit Standard-WordPress-Blöcken, während das Child Theme komplexere Header mit Multi-Level-Navigation und vollständiger Barrierefreiheit-Unterstützung (Tastatursteuerung, ARIA-Attribute) bietet.

Barrierefreiheit:
Achte darauf, dass jede Navigation ein eindeutiges ARIA-Label erhält (z.B. "Hauptnavigation" statt nur "Menü"). Das ist besonders wichtig, wenn mehrere Navigationen auf der Seite existieren, damit Screenreader diese unterscheiden können.

Links:
WP Design System: https://wp-design-system.com
kulturbanause Website: https://kulturbanause.de
Fediverse: https://kulturbananse.de/kulturbanaus...

Rechtlicher Hinweis:
WP Design System ist ein Theme für WordPress. WordPress ist eine eingetragene Handelsmarke der WordPress Foundation.

Tags:
#wordpress #wordpresstheme #designsystem