60 Minuten GRATIS Webdesign-Workshop

Mit Gesch├Ąftsf├╝hrer & Webdesign-Profi Oliver Pfeil

WordPress Header und Footer bearbeiten: So geht’s ­čçę­čç¬

Der WordPress Header und Footer sind ein elementarer Bestandteil deiner Website. In diesem Artikel lernst du:

  • Wie du den WordPress Header bearbeiten kannst.
  • Wie du den WordPress Footer bearbeiten kannst.
  • Wie du diese Elemente frei gestalten und andern kannst.

Der Header mit dem Men├╝ ist der wichtigste Teil deiner Website. Die Navigation ist entscheidend daf├╝r, ob dein Besucher die gew├╝nschten Inhalte auf deiner Seite findet, oder ob er genervt auf den Zur├╝ck-Button klickt.

WordPress Header und Footer bearbeiten

Ob und in welcher Form du den Header und den Footer bearbeiten kannst, h├Ąngt ganz von deinem WordPress Theme ab. Jedes Theme hat andere M├Âglichkeiten und entsprechend bist du von der Funktionalit├Ąt deines Designs abh├Ąngig.

Anders ausgedr├╝ckt:
Falls du den Header und Footer nicht wie gew├╝nscht bearbeiten m├Âchtest, brauchst du ein anderes Theme.

  1. Klicke auf Design – Customizer.
  2. Suche nach dem Bereich „Header“ oder „Footer“.
  3. Sehe dir die m├Âglichen Einstellungen an und f├╝hre die gew├╝nschten ├änderungen durch.

An dieser Stelle kannst du bei vielen Themes f├╝r den Header die Farbe ├Ąndern und auch den Text des Footers bearbeiten. Neben dem WordPress Header und dem Footer kannst du hier weitere Einstellungen f├╝r deine Website durchf├╝hren.

Wichtig: Falls der Men├╝punkt Customizer nicht dargestellt wird, verwendest du eines der WordPress Standard Themes. Hier ist die Anpassung etwas anders, das nur zur Info.

Tipp: Manche Themes (wie beispielsweise WPAstra, OceanWP oder GeneratePress) gibt es in einer kostenlosen Version und in einer PRO-Version. Die PRO-Version hat entsprechend mehr M├Âglichkeiten. Falls du die kostenlose Variante verwendest, kannst du dir ├╝ber ein Upgrade Gedanken machen.

WordPress Theme ├Ąndern

Wenn dir dein Theme keine M├Âglichkeiten bietet, den Header und Footer zu bearbeiten, brauchst du eine Alternative. Da gerade der Header sehr wichtig ist, solltest du dir eine Alternative ├╝berlegen.

F├╝r WordPress gibt es tausende Themes und sogenannte Theme-Builder. Mit einem solchen Theme-Builder kannst du deine Website ├╝ber eine visuelle Oberfl├Ąche gestalten. Du kannst damit also auch deinen WordPress Header bearbeiten und einen individuellen Footer mit eigenem Text und deinen gew├╝nschten Farben erstellen.

Meine Empfehlungen:

Ganz besonders kann ich dir den Thrive Theme Builder empfehlen. Dieser bietet mit Abstand am meisten M├Âglichkeiten, da du ├╝ber eine visuelle Oberfl├Ąche deine komplette Webseite gestalten kannst.

Mit dieser absolut genialen L├Âsung kannst du das komplette Theme ├╝ber einen visuellen Editor auf deine Bed├╝rfnisse anpassen. Das ├ändern des WordPress Headers und auch des WordPress Footers wird damit zum Kinderspiel.

Hauptmen├╝ und Footermen├╝

Gruns├Ątzlich empfehle ich dir, zwei Men├╝s auf deiner Webseite zu verwenden. Zum einen das Hauptmen├╝, das im Header platziert ist und das Footermen├╝, das entsprechend im Footer (also ganz unten auf der Seite) platziert ist.

Im Hauptmen├╝ solltest du alle wichtigen Men├╝punkt f├╝r den Besucher darstellen. Also alle Seiten, die f├╝r den Besucher interessant und entscheiden sind. In das Footermen├╝ kannst du alle Men├╝punkte packen, die du zwar ben├Âtigst, die aber f├╝r den Besucher nicht wirklich wichtig sind.

  • Hauptmen├╝: Ein perfektes Men├╝ f├╝r deine Besucher. Hier m├╝ssen alle wichtigen Seiten ├╝bersichtlich verlinkt sein.
  • Footermen├╝: Hier kannst du die f├╝r deine Besucher weniger wichtigen Seiten verlinken.

Tipps zum Header

Jetzt m├Âchte ich dir noch ein paar wertvolle Tipps zum Header geben, da dieser einfach sehr wichtig ist.

  • ├ťbersichtliches Men├╝: Das Wichtigste im Header ist das Men├╝. Achte darauf, dass dein Men├╝ ├╝bersichtlich, verst├Ąndlich und klar angeordnet ist. Nur wenn sich dein Besucher ganz einfach zurechtfindet, wird er das Men├╝ benutzen und auf deiner Website bleiben.
  • Logo: In der Regel findet man im Header auch ein Logo. Viele Header sind so gestaltet, dass das Logo auf der linken Seite und das Men├╝ auf der rechten Seite dargestellt wird.
  • Zeile mit Kontaktdaten: Eine weitere M├Âglichkeit besteht darin, im Header Kontaktdaten wie E-Mail, Telefon, ├ľffnungszeiten oder die Adresse zu hinterlegen. Dadurch machst du es deinen Besucher einfach, mit dir in Kontakt zu treten.
  • Sticky-Header: Manche Themes bieten die M├Âglichkeit, einen Header Sticky zu machen. Sticky bedeutet, dass der Header beim Scrollen nach unten immer sichtbar bleibt. Das erh├Âht die Usability f├╝r deinen Besucher.
  • Farben: Ich empfehle dir, den Header farblich vom Rest deiner Website abzuheben. Der Besucher soll auf den ersten Blick erkennen, was der Header und was der Rest des Inhalts ist. Achte hier allerdings auf ein schlichtes und ├╝bersichtliches Design und ├╝bertreibe es nicht.
  • ├ťbersicht und Einfachheit: Einfachheit ist ein Schl├╝ssel zum Erfolg. Dein Besucher muss es einfach haben und er muss deine Website verstehen. Achte also darauf, dass du keine komplizierte Navigation verwendest. Je einfacher, umso besser.

FAQ – Fragen und Antworten

Was ist der Header in WordPress?

Der Header ist der oberste Bereich deiner WordPress Website. Im Header befindet sich in aller Regel das Logo und die Hauptnavigation. Der Header sollte optisch vom Inhalt der Webseite grafisch abgegrenzt sein. Dementsprechend ist der Header so ziemlich das wichtigste Element auf deiner Website.

Wie ├Ąndere ich den Header in WordPress?

├ťber den Customizer kannst du deinen WordPress Header ├Ąndern. Den Customizer findest du im WordPress Backend unter Designs. Je nachdem, welches Theme du verwendest, stehen dir mehr oder weniger Individualisierungsm├Âglichkeiten zur Verf├╝gung.

Was ist der Footer in WordPress?

Der Footer ist der unterste Bereich auf deiner Webseite. In der Regel findet man hier die Footernavigation mit Impressum und der Datenschutzerkl├Ąrung. Im Footer kannst du zus├Ątzlich beispielsweise die Kontaktdaten, Adresse und Links zu Social-Media-Profilen erg├Ąnzen.

Was ist ein WordPress Footer Widget?

Manche WordPress-Themes bieten dir die M├Âglichkeit, f├╝r den Footer spezielle Widgets zu nutzen. Widgets sind Bereiche, die du mit Inhalten bef├╝llen kannst. Das kann ein eigener Text mit beispielsweise den ├ľffnungszeiten oder der Adresse sein, oder auch eine individuelle Navigation mit Links zu deinen Social Media Portalen.

Was kommt alles in den Footer?

Du kannst den Footer ganz schlicht gestalten und lediglich die Footernavigation darin einbinden. Alternativ kannst du auch einen umfangreichen Footerbereich gestalten und weitere Informationen darin darstellen. Hier ein paar Beispiele dazu:

Wie binde ich einen Code in den WordPress Header ein?

In bestimmten F├Ąllen macht es Sinn, einen Code in den WordPress Header einzuf├╝gen. Das kann ein Tool oder auch ein Tracking-Code sein. Viele Themes bieten dazu ein eigenes Feld, wo du einen Code hinzuf├╝gen kannst. Das ist nat├╝rlich praktisch, da du nicht in die Programmierung direkt eingreifen musst. Falls dein Theme eine solche M├Âglichkeit nicht bietet, kannst du als Alternative ein Plugin daf├╝r nutzen.

Deine perfekte Website. In Rekordzeit.

60 Minuten Webdesign-Seminar mit Experte Oliver Pfeil

60 Minuten Webdesign-Seminar mit Experte Oliver Pfeil