Dir stehen mehrere Header-Designs für deine Website zur Verfügung. Finde das Design, das am besten zu deinen Wünschen passt und verändere so das Aussehen deiner Website, z. B. indem du dein Logo oder den Namen deiner Website hervorhebst.
Springe zu:
So änderst du das Header-Design
- In der Seitenleiste deines Cockpits, navigiere zu Website > Editor.
- In der Fußleiste, wähle
. - Wähle den Tab
. - Wähle das Header-Design, das am besten zu deinem Business passt. Bewege deine Maus über ein Header-Design oder wähle die zugehörige Abbildung, um mehr Informationen zu der Ausrichtung des Headers und der empfohlenen Nutzung zu erhalten. Außerdem kannst du auf der Seite im Hintergrund eine Vorschau des Headers sehen, sobald du ein Header-Design gewählt hast. Du kannst auch
in der rechten oberen Ecke des Header-Design-Fensters gedrückt halten und dann das Fenster bewegen, um so andere Bereiche der Seite im Hintergrund sehen zu können. - Sobald du dich für ein Header-Design entschieden hast, wähle Speichern.
Die verschiedenen Header-Designs
Du bist dir unsicher, welches Header-Design am besten zu deinem Business passt? Sehen wir uns mal die verschiedenen Header, ihre Struktur und die für den jeweiligen Header empfohlene Menüstruktur genauer an.
Die Größe einer Menüstruktur hängt von mehreren Faktoren ab. Viele Seiten und Unterseiten führen zu einer größeren Menüstruktur. Wenn du nur wenige Seiten hast, ist die Menüstruktur eher klein. Außerdem spielt auch der Name der Seiten eine wichtige Rolle. Wenn du dich für längere Seitennamen entscheidest, wird das Menü größer. Kürzere Seitennamen führen zu einer kleineren Menüstruktur.
Bitte beachte zudem, dass deine Logo-Einstellungen sich auf dein gewähltes Header-Design auswirken können. Du kannst die Ausrichtung des Logos in den entsprechenden Logo-Einstellungen ändern.
Du kannst frei entschieden, ob du dein Logo oder den Namen deiner Website im Header anzeigen möchtest. Erfahre mehr in unserem Artikel Lade ein Logo hoch.
Beachte außerdem, dass die Reihenfolge der einzelnen Header-Design-Optionen in deinem Editor abhängig von deiner gewählten Design-Vorlage ist.
Option 1
|
Allgemein |
Marke |
Menü | Suche |
| Die Suchleiste, das Logo / der Website-Name und das Menü werden jeweils in einer eigenen Zeile dargestellt. | Das Logo / der Website-Name wird ganz links angezeigt, unter der Suchleiste aber über dem Menü. | Das Menü ist linksbündig und wird unter der Suchleiste und dem Logo / dem Website-Namen angezeigt. | Die Suchleiste wird ganz oben links angezeigt, über dem Logo / dem Website-Namen und dem Menü. |
Dieser breite Header hebt deine Marke hervor und eignet sich gut für mittelgroße Menüstrukturen.
Option 2
|
Allgemein |
Marke | Menü | Suche |
| Das Suchsymbol, das Logo / der Website-Name und das Menü werden in einer Zeile angezeigt. | Das Logo / der Website-Name ist zentriert und wird zwischen dem Menü und dem Suchsymbol angezeigt. | Besucher können ganz links  wählen, um das Menü zu öffnen. |
Besucher können ganz rechts ein Suchsymbol  wählen, um die Suchleiste zu öffnen. |
Mit diesem schmalen Header kannst du dein Logo / den Namen deiner Website, das Menü und das Suchsymbol in einer Zeile anzeigen. Da das Menü eingeklappt ist, liegt der Fokus auf deiner Marke. Außerdem ist der Header aufgrund des eingeklappten Menüs eine gute Wahl für große Menüstrukturen.
Option 3
|
Allgemein |
Marke |
Menü | Suche |
|
Das Logo / der Website-Name und das Suchsymbol werden in einer Zeile angezeigt. Das Menü wird in einer separaten Zeile dargestellt. |
Das Logo / der Website-Name ist zentriert. |
Das Menü ist zentriert und wird unter dem Suchsymbol und dem Logo / dem Website-Namen angezeigt. | Besucher können ganz rechts ein Suchsymbol  wählen, um die Suchleiste zu öffnen. |
Du magst linksbündige Menüstrukturen nicht so gerne? Mit diesem Header-Design kannst du einen zentrierten Header wählen, der sich gut für mittelgroße Menüstrukturen eignet.
Option 4
|
Allgemein |
Marke |
Menü | Suche |
| Das Logo / der Website-Name und die Suchleiste werden in einer Zeile angezeigt. Das Menü wird in einer separaten Zeile angezeigt. | Das Logo / der Website-Name wird ganz links angezeigt. | Das Menü ist linksbündig und wird unter dem Logo / dem Website-Namen und der Suchleiste angezeigt. | Die Suchleiste wird rechts angezeigt. |
Dieser Header eignet sich gut für mittelgroße Menüstrukturen.
Bitte beachte, dass dieses Header-Design noch nicht für alle Design-Vorlagen verfügbar ist.
Option 5
|
Allgemein |
Marke |
Menü | Suche |
| Das Logo / der Website-Name, das Menü und das Suchsymbol werden in einer Zeile angezeigt. | Das Logo / der Website-Name wird ganz links angezeigt. | Das Menü ist linksbündig und wird zwischen dem Logo / dem Website-Namen und dem Suchsymbol angezeigt. | Besucher können ganz rechts das Suchsymbol  wählen, um die Suchleiste zu öffnen. |
Da der Fokus in diesem schmalen Header auf dem Menü liegt, eignet er sich gut für kleine Menüstrukturen.
Bitte beachte, dass dieses Header-Design noch nicht für alle Design-Vorlagen verfügbar ist.
Alle Header
In allen Headern werden deine Alleinstellungsmerkmale (falls festgelegt) ganz oben auf deiner Website angezeigt. Außerdem wird der Warenkorb (falls aktiviert) in der rechten oberen Ecke angezeigt.
Du musst dir natürlich keine Sorgen um dein responsives Design machen. Dein Header wird immer in einer Version dargestellt, die für das genutzte Gerät optimiert wurde. Das bedeutet allerdings auch, dass ein Header auf kleineren Geräten leicht anders aussehen kann als beschrieben.