Menü-Studio: Menüs per Drag-and-drop bauen

Das Menü-Studio (Baza Helper > Menü-Studio) ist ein visueller Editor für Website-Menüs. Es funktioniert mit jedem Theme. Baza Theme gibt das Menü mit eigenem Header-Markup aus, und jedes andere Theme kann es per Shortcode, PHP-Aufruf oder Block ausgeben.

Ein Menü bauen

• Fügen Sie Einträge hinzu und ziehen Sie sie auf der Fläche. Legen Sie einen Eintrag auf einer anderen Karte ab, um ihn zu verschachteln, oder ändern Sie die Reihenfolge, indem Sie ihn am Rand ablegen.
• Wählen Sie mehrere Einträge gleichzeitig aus, zoomen Sie die Fläche und nutzen Sie die Minimap.
• Nutzen Sie Rückgängig und Wiederholen und beginnen Sie mit Vorlagen.
• Klicken Sie auf Vollbild für eine größere Fläche. Esc oder dieselbe Schaltfläche beendet ihn.

Das Eintragsfeld

Wählen Sie einen Eintrag, um ihn zu bearbeiten. Die Aktionen sind Symbolschaltflächen: Unterelement hinzufügen, duplizieren, nach oben, nach unten und entfernen. Die Felder stehen zu zweit in einer Zeile.

• Titel je Sprache: bis zu drei Sprachen sind Chips in der Beschriftungszeile, bei mehr wird die Beschriftung zu einem Umschalter. Karten auf der Fläche zeigen Punkte für ausgefüllte Sprachen.
• Symbol, Klassen und Attribute (Akkordeon): Symbol (keines, ein eingefügtes SVG mit Live-Vorschau oder ein Bild aus der Mediathek), seine Position, CSS-Klassen von Eintrag und Link, HTML-ID, Titel, ARIA-Label, rel-Werte, neuer Tab und eigene Attribute data-* und aria-*.
• Felder werden beim Tippen geprüft: CSS-Bezeichner, eine eindeutige ID und die erlaubten Attribute. Ein ungültiger Wert wird erklärt und nicht gespeichert. Ein SVG, das der Sanitizer nicht neu aufbauen kann, wird mit einer Begründung abgelehnt.

Der Editor warnt außerdem vor defekten Links und fehlenden Übersetzungen. Die Chips in der Werkzeugleiste zeigen die Zahlen.

Mega-Panels

Ein Eintrag kann ein Mega-Panel mit 1 bis 4 Spalten öffnen. Ein Panel besteht aus Blöcken: Text, Bild, Linkgruppe und Hallen (Leistungen des Buchungskalenders, wenn er installiert ist).

Mehrere Menüs und Orte

• Nutzen Sie die Leiste über der Fläche, um Menüs zu wechseln, Neues Menü, Umbenennen und Löschen. Das Hauptmenü gibt es immer, und es lässt sich nicht löschen. Es können 30 Menüs existieren.
• Wo es angezeigt wird listet die Menü-Orte des Themes als Kontrollkästchen. Ein angehakter Ort gibt dieses Menü dort aus, wo das Theme diesen Ort anfordert.
• WordPress-Menü importieren macht aus einem unter Design > Menüs erstellten Menü ein Studio-Menü. Das WordPress-Menü bleibt unberührt. Ist das geöffnete Studio-Menü leer und die Website hat ein WordPress-Menü, erscheint das Import-Feld von selbst.

Das Menü auf der Website zeigen

[baza_menu id="main" class="my-nav" label="Main menu"]

 'main', 'class' => 'my-nav', 'label' => 'Main menu' ) ); ?>

Ohne ID wird das Hauptmenü verwendet. Die Ausgabe ist ein nav mit verschachtelten Listen, echten Schaltflächen für Mega-Panels, einem Hamburger auf kleinen Bildschirmen und Tastaturunterstützung (Esc, ArrowDown). Für Block-Themes gibt es den Block Baza menu (baza-helper/menu) unter Design > Editor, mit dem in der Seitenleiste gewählten Menü. CSS und JavaScript laden nur auf Seiten, die ein Menü ausgeben. Farben und Größen sind CSS-Variablen, die mit --baza-menu- beginnen.

Sprachen

Die Sprachen kommen von WPML, Polylang oder TranslatePress, sonst aus der eigenen Spracheinstellung der Website und dem Sprach-Cookie.

Speichern

Speichern Sie mit der Seitenleiste oder Strg+S. Das Speichern braucht die Berechtigung edit_theme_options. Das Menü wird beim Speichern bereinigt: Unbekannte Eintragstypen entfallen, und nur sichere Klassen und Attribute bleiben.