Navigatie

Het navigatieblok is een blok met een verzameling links voor de navigatiemenu’s.


1. Hoe voeg ik het blok toe? #

Klik op het + icoon in de hoofdnavigatie of in het content gebied. Typ ‘navigatie‘ en klik op het navigatieblokicoon om het toe te voegen.

Wanneer je het navigatieblok voor de eerste keer toevoegt en je hebt geen bestaand menu, dan begint het navigatieblok met een paginalijstblok (Alle pagina’s worden weergegeven).

Je wil wellicht niet alle pagina’s in de navigatie. Om dit te veranderen, selecteer je het paginalijstblok in de ‘Lijstweergave‘ (onder ‘Document weergave‘).

Klik op Bewerken in de blokinstellingen en de paginalijstitems worden omgezet in paginalinkblokken. Je kunt nu het navigatieblok inrichten zoals jij wilt.


2. Blokwerkbalk #

De werkbalk van het navigatieblok

Selecteer het blok zodat de blokwerkbalk (erboven) weergegeven wordt. Hieronder leggen we uit wat elke functie in de blokwerkbalk doet.

2.1. Verander naar een ander type blok #

Standaard staat hier het (geselecteerde) blokicoon, dat per blok verschilt. Klik hierop om een ander blok te kiezen onder dit blok te verwijderen en weer op het + icoon te hoeven klikken. Kies een blok uit de lijst die na het klikken verschijnt.


2.2. Blok verplaatsen #

Het icoon met zes stipjes heeft een sleepfunctie. Klik op deze puntjes en houd ze vast om het blok te verplaatsen naar een nieuwe locatie. Naast de sleepfunctie staat een icoon met een pijltje omhoog en omlaag. Klik op één van de pijltjes om het blok een plekje omhoog of omlaag te schuiven.


2.3. Verander horizontale item uitlijning #

Hier kan je de horizontale uitlijning van de items instellen. Kies voor:

  • Links
  • In het midden
  • Rechts
  • Gelijkmatig verspreid

2.4. Verander uitlijning #

Verander hiermee de uitlijning naar:

  • Geen
  • Wijd
  • Volle breedte

2.5. Meer opties #

Onder dit icoon vind je meer bewerkingsfuncties zoals:

  • Dupliceren
  • Verwijderen
  • Invoegen voor
  • Invoegen na
  • Bewerken in HTML

Hiervoor hebben we een apart overzicht gemaakt op deze pagina. Zoek naar de functie die je wilt gebruiken.


3. Blokinstellingen #

De blokinstellingen zijn verdeeld in twee tabbladen: instellingen ( Instellingen icoon in blokinstellingen tabblad. ) en stijlen ( Stijlen icoon )

3.1. Lijst weergave #

Het navigatieblok maakt gebruik van verschillende menu’s. Die menu’s bestaan weer uit meerdere paginalinkblokken.

In de ‘Lijstweergave‘ van de blokinstellingen kan je een bestaand menu kiezen of wijzigen. Ook kan je een nieuw menu maken door op het opties icoon ( ) te klikken. Kies vervolgens voor ‘Maak nieuw menu‘.

Tip: geef het menu een beschrijvende naam zoals ‘Menu footer‘ of ‘Hoofdnavigatie‘ en niet ‘Menu1‘ of ‘MenuA‘. Dit helpt bij het gemakkelijk en snel navigeren tussen alle navigatieblokken als je de navigatie in de header/ footer template gaat bewerken.

3.2. Instellingen #

Pas hier de werking van het blok aan.

3.2.1. Layout #

Kies hier voor een horizontale of verticale oriëntatie (richting) van de items. Vervolgens kan je de items uitlijnen bij ‘Justification‘.

  • Horizontale opties:
    • Links
    • Midden
    • Rechts
    • Gelijkmatig uitlijnen
  • Verticale opties:
    • Boven
    • Midden
    • Onder
    • Uitrekken
Toestaan om op meerdere regels weer te geven

Hier kan je inschakelen of de items automatisch overvloeien op een volgende regel als ze slechts op één regel passen.

Als deze optie uitgeschakeld staat, worden de items kleiner zodat ze allemaal op dezelfde regel passen en wordt de tekst afgebroken.

3.2.2. Toon #

Hier kan je kiezen om een overlay menu te tonen. Je kent een overlay menu misschien wel van je mobiele telefoon. Je klikt op dit icoon ( Overlay hamburgermenu blokinstellingen navigatieblok ) en een apart navigatiemenu wordt over je huidige scherm getoond.

Bij ‘Toon pictogram knop‘ kan je kiezen of je pictogrammen wilt laten zien of de woorden ‘menu‘ en ‘sluiten‘.

Kies je voor pictogrammen dan verschijnen twee extra instellingen:

  • Pictogram: Kies hier of je een pictogram met twee streepjes of met drie streepjes wilt.
  • Overlay menu: Kies hier of en wanneer je een overlay menu wilt. Kies voor ‘Uit‘ als je dit nooit wil, kies voor ‘Mobiel‘ als je de overlay alleen op mobiele apparaten wilt weergeven en kies voor ‘Altijd‘ als je op alle apparaten een overlay menu wilt.

3.2.3. Geavanceerd #

Bloknaam

Pas hier de naam van het blok aan. Deze vind je terug in het ‘Document overzicht’.

Extra CSS-klasse

Gebruik dit invulveld om extra CSS-klassen toe te voegen.


3.3. Stijlen #

Pas hier de opmaak van het blok aan.

3.3.1. Kleur #

Pas hier de kleur van de tekst en achtergrond aan van het normale navigatiemenu en van de overlay navigatie. Je hebt de keuze uit de themakleuren of de standaardkleuren. Klik op het grijs/ wit geblokte veld om zelf een kleur in te stellen.

3.3.2. Typografie #

Hier vind je alle instellingen voor het bewerken van lettertypes.

Grootte

Dit is een standaard instelling die altijd zichtbaar is. Als je wilt dat de grootte van een (kop)tekst afwijkt van de standaard, dan kan je kiezen voor de volgende maten:

  • S
  • M
  • L
  • XL
  • XXL

Wil je het zelf instellen? Klik dan op dit icoon ( Schuifregelaar pictogram blokinstellingen ). Kies hier voor PX, EM, REM (Of %, VW of VH). Meer uitleg hierover vind je in dit overzicht.

Via het driepunten icoon achter het woord typografie kan je meerdere instellingen zichtbaar maken:

  • Font familie: De stijl van de letters
  • Weergave: De dikte van de letters binnen de font familie
  • Lijnhoogte: hoe hoog de letters zijn
  • Letterafstand: Hoe ver de letters van elkaar af staan
  • Tekstversiering: Onderlijnen of doorhalen van de tekst
  • Lettercase: De manier van hoofdlettergebruik
    • HOOFDLETTERS
    • kleine letters
    • Met Hoofdletter

3.3.3. Afmetingen #

Pas hier de ruimte om het blok aan.

Klik op het + icoon achter ‘Afmetingen’ en maak een keuze.

Blokafstand

Bij blokafstand kan je de afstand tussen de blokken instellen. Verschuif de blauwe stip om de afstand groter te maken.

Wil je het zelf instellen? Klik dan op dit icoon ( Schuifregelaar pictogram blokinstellingen ). Kies hier voor PX, EM, REM (Of %, VW of VH). Meer uitleg hierover vind je in dit overzicht.

Wat zijn je gevoelens

Kom je er niet uit, mis je een artikel of heb je een vraag?

Neem contact op via onderstaande button.