Header-Element bearbeiten

In diesem Beitrag lernst du, wie du dein Header-Element (sprich das Logo und das Menü) bearbeitest, damit es deinen Wünschen entspricht.

Bevor du loslegst, schaue dir bitte folgenden Beitrag an:
Einführung in den Builder

Klicke auf das Logo-Element und danach in der Sidebar auf Einstellungen:

Fullscreen 26 04 18 13 55

Hier hast du zuerst die Wahl, ob es sich um ein Bild oder Text handeln soll. Wählst du „Bild“ aus, findest du in dem Logo-Element ein Bild-Element, wo du eine Bilddatei hochladen kannst. Wählst du „Text“ aus, kannst du den Inhalt mit Doppelklick bearbeiten.

Außerdem kannst du wählen, ob dein Logo links oder rechts angezeigt werden soll.

Unter „Link“ kannst du die Ziel-URL festlegen. In der Regel sollte das Logo aber auf deine Startseite leiten. Also reicht das „/“ aus.

Menü

Menüpunkte verschieben und bearbeiten

Per Drag and Drop kannst du deine Menüpunkte hin und her schieben:

Apr 26 2018 14 12 02

Auch auf die linke Seite. Das ist besonders sinnvoll, wenn das Logo rechts ist.

Mit einem Doppelklick auf einen Menüpunkt kannst du ihn bearbeiten:

Fullscreen 26 04 18 09 47

Menüpunkte verlinken

Klicke auf den Menüpunkt und navigiere dann in der Sidebar unter Einstellungen > Links, um die Linkeinstellungen vorzunehmen:

Fullscreen 26 04 18 13 57

Gehen wir die Typen kurz durch:

  • Webseiten-URL - Hier kannst du eine beliebige URL hinterlegen.

  • Seite - Hier kannst du eine bestehende Design- oder Content-Seite auswählen.

  • Bereich auf dieser Seite - Hier kannst du einen Sprunganker auswählen, der auf einen Bereich in diesem Template oder dieser Design-Seite verlinkt. Mehr dazu hier: Sprunganker in einem Template oder einer Design-Seite erstellen

Neuen Link erstellen

Wähle das gesamte Header-Element aus, navigiere in der Sidebar auf Einstellungen > Navigation und klicke auf „+ Neuer Link“:

Fullscreen 26 04 18 13 59

Hier hast du außerdem die Möglichkeit, den Inhalt deines Headers über die ganze Breite anzuzeigen, wenn du das passende Feld aktivierst.

Wähle einen Menüpunkt aus, navigiere in der Sidebar unter Einstellungen > Dropdown und aktiviere die Funktion:

Fullscreen 26 04 18 14 01

Wenn du „Dropdown per Mouseover“ aktivierst, wird das Dropdown-Menü nicht per Klick, sondern erscheint, wenn man mit der Maus darüber fährt. Leider funktioniert die Dropdown-Funktion dann nicht unter mobile.

Mit einem Klick auf „Menü öffnen“ kannst du das Dropdown-Menü öffnen und bearbeiten, so wie du es auch von den normalen Menüpunkten gewohnt bist. Wenn du hier einen neuen Menüpunkt erstellen möchtest, kopiere einfach einen bestehenden.

Um das gesamte Dropdown-Menü zu stylen, wählst du das Dropdown-Menü aus (das geht am besten über die Baumstruktur). Danach kannst du zum Beispiel die Hintergrundfarbe des Feldes ändern:

Fullscreen 26 04 18 14 03

Außerdem solltest du wissen, dass du das Header-Element global machen kannst. Das empfehlen wir auch, da es in der Regel in allen Templates identisch ist. Hier mehr zu globalen Elementen:
Globale Elemente verstehen und verwenden

Nächsten Schritte

Füge jetzt dein Logo hinzu, bearbeite die Menüpunkte, verlinke diese und style das Header-Element so, dass es deinen Wünschen entspricht.

Hast du noch Fragen?

Noch keine Kommentare vorhanden.

Was denkst du?

© 2012-2018 by Chimpify UG (haftungsbeschränkt)