Menu's en navigatie instellen

Samenvatting

Het navigatiemenu is het menu waarmee bezoekers door je website navigeren. In Mach3Blocks stel je de navigatie in via de website-instellingen en pagina-instellingen. Je bepaalt het navigatietype, welke pagina's in het menu verschijnen, de menustructuur en hoe het menu eruitziet op mobiel (het zogenaamde "hamburger-menu").

Hoe werkt het

Het veld Navigatie (geldt voor de hele website)

Waar: Website-instellingen → tab Algemeen → veld Navigatie

Met het veld Navigatie koppel je (optioneel) een opgeslagen navigatie aan je website. Zo'n navigatie wordt als een laag over je website gelegd, waardoor bezoekers geanimeerd kunnen navigeren. Je kunt hetzelfde per pagina instellen via Pagina-instellingen → tab Menu's → veld Navigatie, zodat een specifieke pagina een eigen navigatie-laag krijgt.

Los hiervan bouwt Mach3Blocks je gewone menu automatisch op uit je pagina's — zie hieronder.

Hoe een pagina in het menu verschijnt

Elke pagina staat automatisch in het menu. In de Pagina-instellingen verfijn je hoe — verdeeld over drie tabs:

Tab Algemeen

  • Navigatie — koppel (optioneel) een navigatie-laag aan deze pagina (geldt voor deze pagina en haar onderliggende pagina's).

Tab Menu's

  • Omschrijving — alternatieve tekst die in het menu wordt getoond
  • Icoon — een icoon naast de paginanaam
  • Afbeelding — een afbeelding voor de navigatie met afbeeldingen

Tab Zichtbaarheid

  • Uitschakelen — pagina volledig uitzetten
  • Verbergen in menu's — pagina blijft bereikbaar maar verschijnt niet in het menu
  • Verbergen in zoekresultaten — pagina verschijnt niet in de interne zoekmachine

Pagina's verschijnen automatisch in het menu op basis van hun volgorde en niveau; er is geen aparte "voeg toe aan menu"-knop. De volgorde van de paginalijst bepaalt de menustructuur — je kunt tot maximaal 3 niveaus diep gaan. De volgorde wijzig je door pagina's te slepen (drag & drop). Wil je een pagina juist niet in het menu, gebruik dan Verbergen in menu's.

Uitklapmenu's (submenu's)

Heeft een pagina onderliggende pagina's, dan verschijnen die als een uitklapmenu (een submenu) onder het hoofditem: de bezoeker klapt het open en ziet de subpagina's. Je voegt die items niet handmatig toe — ze volgen automatisch uit je paginastructuur, tot 3 niveaus diep. De opmaak van een uitklapmenu stel je in door het betreffende menu-niveau in de editor te selecteren. Afhankelijk van het gekozen menu zijn er verschillende weergaven mogelijk, van een eenvoudige lijst tot een rijkere lijst met icoon en omschrijving.

Hamburger-menu (op mobiel)

Op kleinere schermen (zoals telefoons en tablets) wordt het menu automatisch een "hamburger-menu" — dat zijn de drie streepjes die je kent van mobiele websites. Je kunt instellen bij welke schermbreedte het menu omschakelt naar dit formaat.

Waar: Editor → selecteer het navigatieblok → menu-element → rechter paneel → Instellingen → Hamburger t/m schermgrootte

Je kiest tot en met welk schermformaat het menu een hamburger-menu wordt (je kiest een apparaat, geen pixelwaarde). Tot en met dat formaat toont de site het hamburger-menu; op grotere schermen het normale menu.

Optie Apparaat Schermbreedte
Desktop grote schermen ≥ 1280 px
Laptop laptops 1024–1279 px
Tablet tablets 768–1023 px
Telefoon liggend telefoon liggend 480–767 px
Telefoon staand telefoon staand < 480 px

Er is ook een optie Geen als je nooit een hamburger-menu wilt.

Let op: deze instelling stel je per navigatieblok in, niet voor de hele website.

Als je een navigatieblok selecteert in de editor, vind je deze instellingen:

  • Hamburger t/m schermgrootte — tot en met welk schermformaat het menu een hamburger wordt
  • Onepagermenu — voor websites met ankerlinks (alles op één pagina, het menu springt naar secties)
  • Startpunt — vanaf welk niveau in de pagina-hiërarchie het menu begint
  • Niveaus — hoeveel menulagen worden getoond (1, 2 of 3)

Je maakt individuele menu-items op door ze in de editor aan te klikken en daarna de opmaak in het rechter paneel aan te passen (bijvoorbeeld kleur, lettertype, ruimte en de hover-stijl). Dit werkt voor zowel de hoofdmenu-items als de submenu-niveaus: selecteer het item dat je wilt aanpassen, en de opmaak geldt voor dat niveau.

Collectie-items in het menu

Via de collectie-instellingen → Zichtbaarheid kun je collectie-items (zoals blogposts of portfolio-items) opnemen in de navigatie. Dit werkt niet met externe data of items met een zichtbaarheidsdatum.

Elementen verbergen per apparaat

Via het rechter paneel → Instellingen → Verbergen kun je elk element verbergen op specifieke apparaten. Er zijn 5 breakpoints beschikbaar (dezelfde als hierboven). Handig als je bijvoorbeeld op mobiel een ander menu wilt tonen dan op desktop.