In dieser Anleitung: Mega-Menü öffnen | Mega-Menü einstellen | Spalten einstellen | Menü hinzufügen | Blöcke hinzufügen | Bild hinzufügen | Anzeige pro Gerät
Mega-Menü öffnen
Im Header-Editor kannst du ein Mega-Menü aufbauen und anpassen. Wähle in der Navigation das entsprechende Mega-Menü-Item aus. Auf der linken Seite öffnen sich anschließend die Einstellungen dieses Mega-Menü-Items.
Bei den Einstellungen MegaMenuItem findest du unter anderem die Option Mega-Menü anzeigen. Hiermit kannst du das Mega-Menü während der Bearbeitung öffnen und wieder ausblenden.
Mega-Menü einstellen
Das Mega-Menü besteht aus verschiedenen Blöcken und Spalten. Wenn du ein Element im Mega-Menü auswählst, erscheinen links die Einstellungen für dieses spezifische Element.
Je nach ausgewähltem Element kannst du oben wechseln zwischen:
- Content
- Style
- Advanced
Spalten einstellen
Ein Mega-Menü kann aus mehreren Spalten bestehen. Wähle eine Spalte aus, um die Einstellungen Col zu öffnen.
Unter Content kannst du einer Spalte verschiedene Elemente hinzufügen:
- Text hinzufügen
- Bild hinzufügen
- Icon hinzufügen
- Button hinzufügen
- Add columns
Über den Tab Style kannst du die Hintergrundfarbe pro Spalte anpassen.
Über den Tab Advanced kannst du unter anderem die Spaltenbreite und den Innenabstand der Spalte (Padding) anpassen. Auch eine Einstellung für Überlappung ist hier verfügbar. Damit kannst du ein Bild über ein anderes Element überlappen lassen.
Wenn du die gesamte Spaltengruppe auswählst, öffnen sich die Einstellungen Columns. Hier kannst du bei Spalten-Layout die gewünschte Aufteilung der Spalten wählen.
Menüpunkte hinzufügen
Für die Links im Mega-Menü wird ein Menü (Liste) verwendet. Wähle eine bestehende Liste aus, um die Einstellungen List zu öffnen.
In den Bearbeitungsoptionen kannst du anschließend neue Elemente zur Liste hinzufügen:
- Menüpunkt hinzufügen
- Aufzählungspunkt hinzufügen
Im Video ist zu sehen, dass mehrere Menülisten neben- und untereinander im Mega-Menü platziert werden können. So kannst du verschiedene Menüs mit Menüpunkten auf mehrere Spalten verteilen.
Blöcke hinzufügen
Klicke in einen leeren Bereich auf Blöcke hinzufügen, um ein neues Element im Mega-Menü zu platzieren.
Du änderst das Spalten-Layout zum Beispiel von 3 auf 4.
Im Bereich Content sind verschiedene voreingestellte Elemente verfügbar.
darunter:
- Text
- Abbildung
- Icon
- Button
- Add columns
Zusätzlich kannst du auch feste Navigationsblöcke hinzufügen, wie zum Beispiel:
- Text
- Icon
- Abbildung
- Bildlink
- Button
- Link
- Dropdown
- Slider
- Menü (Liste)
- Akkordeon
- Offcanvas
- HTML
Wie diese funktionieren, wird in der Anleitung Html und der Pagebuilder erklärt: https://support.sparkles.io/kennisbank/html-en-de-pagebuilder/#elementen
Tipp
Ein Mega-Menü muss nicht nur aus Links bestehen. Du kannst verschiedene Blöcke kombinieren und zum Beispiel mehrere Menülisten und ein Bild nebeneinander platzieren.
Bild hinzufügen
Neben den Menülisten kannst du auch ein Bild in einer separaten Spalte platzieren.
- Wähle die Spalte aus, in der du das Bild platzieren möchtest.
- Wähle Bild hinzufügen oder öffne Blöcke hinzufügen und wähle Bild.
- Das Bild wird als separates Element innerhalb der Spalte platziert.
Im Beispiel aus dem Video besteht das Mega-Menü schließlich aus mehreren Menülisten mit einer separaten Spalte für ein Bild daneben.
Anzeige pro Gerät
In den Einstellungen verschiedener Elemente findest du auch die Anzeige pro Gerät. Hiermit kannst du festlegen, auf welchen Geräten das ausgewählte Element angezeigt wird.
Prüfe daher bei den verschiedenen Elementen des Mega-Menüs, ob die Anzeige für Desktop, Tablet und Mobilgerät korrekt eingestellt ist.
Video-Erklärung
Schau dir unten die Schritte zum Anpassen und Aufbauen des Mega-Menüs im Header-Editor an.
