bloqyDokumentation

Navigation

Mobiles Menü

Burger-Menü, geöffnetes Menü, Untermenüs und Schnellaktionen auf dem Smartphone.

Auf kleinen Bildschirmen ist kein Platz für ein ausgeschriebenes Menü. Stattdessen erscheint das Burger-Symbol (drei Striche). Wie es sich verhält, stellst du in Navigation gestalten im Reiter Mobil ein.

Ab wann das Burger-Menü erscheint

Bei Burger-Menü bis zu dieser Breite wählst du die Bildschirmgröße, bis zu der das Burger-Menü gezeigt wird. Hat das Hauptmenü viele Punkte, wähle eine größere Breite, damit es auf dem Tablet nicht umbricht. Mit Immer Burger-Menü erscheint es auf allen Geräten.

Geöffnetes Menü

  • Ausklappen – das Menü klappt unter dem Header auf.
  • Seitenleiste – das Menü fährt vom Rand herein.
  • Vollbild – das Menü füllt den ganzen Bildschirm. Auf Wunsch mit großer Schrift und Kontaktmöglichkeiten darunter.
Navigation gestalten, Reiter Mobil mit Burger-Menü bis md, Geöffnetes Menü Ausklappen, Seitenleiste oder Vollbild, Untermenüs und Schnellaktionen
Reiter Mobil

Untermenüs auf dem Smartphone

Aufklappen (Akkordeon) öffnet Unterpunkte direkt darunter, Einschieben mit „Zurück“ zeigt sie auf einer eigenen Ebene mit Zurück-Knopf. Bei vielen Unterpunkten ist das Einschieben übersichtlicher.

Burger-Animation

Wie sich das Symbol beim Öffnen verwandelt: Wird zum X, Dreht sich zum X, Zusammenziehen oder Wird zum Pfeil.

Schnellaktionen neben dem Burger

Trage Telefon, E-Mail oder eine Adresse für „Route“ ein. Dann erscheinen neben dem Burger kleine Symbole, mit denen Besucher direkt anrufen, schreiben oder die Route öffnen.

Tab-Leiste unten

Im Reiter Menüs je Sprache kannst du je Projekt eine Tab-Leiste unten wählen. Sie zeigt die ersten fünf Einträge eines Menüs mit ihren Icons am unteren Bildschirmrand – wie in einer App. Die Icons legst du im Menü bei den Extras eines Eintrags fest.

Tipp

Teste das mobile Menü im Editor mit der Ansicht Smartphone oder auf einem echten Gerät.