WebMakkie

In dit artikel:

Een nieuw menu maken geschikt voor desktop en mobiel

Op je nieuwe website wil je natuurlijk ook een menu toevoegen. Het liefst maak je een menu dat geschikt is voor desktop computers, mobiel en alles er tussenin.

Voordat we een menu kunnen plaatsen moet er wel een kolom zijn om het menu een plekje te geven. Heb je nog geen kolom, of weet je niet waar ik het over heb, lees dan eerst het artikel over secties en kolommen. Ik wacht wel even...

Een nieuw menu maken

Mooi, nu we weten hoe we een kolom moeten plaatsen kunnen we hier een menu aan toe voegen. Aan de linkerkant zie je de balk met elementen. Klik daar op menu.

Hierna ga je met je muis naar de kolom toe waar je het menu in wilt plaatsen. Wanneer je een groene streep in dat vak ziet zoals hieronder klik je nog een keer.

Ga met je muis op het (nu nog niet zichtbare) menu staan, je zult aan de linkerkant een zwart vakje met een wit potloodje te zien krijgen. Klik hierop.

Aan de linkerkant van je scherm zie je nu de instellingen voor je menu.

Vul nu de Menu naam in. Deze naam mag je helemaal zelf bedenken ;) Klik nu op Menu maken en er wordt een spiksplinternieuw menu voor je aangemaakt.

Links aan je menu toevoegen

Ga naar de instellingen van je menu door met je muis op je menu te gaan staan en op het witte potloodje te klikken. Kies nu Bewerken. Aan de linkerkant van het venster zie je nu de menu instellingen. Klik hier op Bewerk menu. Klik vervolgens op Nieuw toevoegen. Je kunt hier nu een bestaande pagina kiezen waar de link naar moet verwijzen. Persoonlijk kies ik er altijd voor om een aangepaste link toe te voegen en vervolgens de volledige url naar de pagina in te voeren inclusief https://www. Dit is echter een persoonlijke keus. Test en probeer wat jou het beste bevalt.

Nadat je de link toegevoegd hebt zul je de link in je menu zien verschijnen. Ga nu weer op je menu staan, klik op het potloodje en klik in de menu instellingen op Bewerk menu om meer links toe te voegen.

Een mobiel menu instellen

Tot nu toe hebben we een desktop menu ingesteld. Nu gaan we dit menu zo instellen dat deze ook bruikbaar is op mobiel, mobiel landscape en eventueel op tablet. Bovenin de WebMakkie website maker zie je een zwarte balk. In het midden van die balk zie je vier icoontjes waar je verschillende apparaten kunt kiezen.

Van links naar rechts zie je:

Desktop (1201 pixels en groter)
Tablet (993 pixels - 1200 pixels)
Mobiel landscape (768 pixels - 992 pixels)
Mobiel portrait (767 pixels en kleiner)

Klik nu op Mobiel portrait om de mobiele weergave te selecteren. Je ziet nu dat het scherm van WebMakkie smaller is geworden. Ga met je muis op je mobiele menu staan en klik weer op het potloodje. Ga aan de linkerkant naar de menu instellingen en klik op stijl bovenaan het venster.

Selecteer Menu (in de afbeelding grijs). Onder view zie je dat horizontaal geselecteerd is. Pas dit aan naar dropdown. Je hebt nu met succes je menu ingesteld als menu voor mobiele apparaten met een resolutie van 768 pixels en kleiner. Om een mobiel menu in te stellen voor andere apparaten selecteer je het betreffende apparaat bovenin de balk en volg je dezelde stappen.

Een sub-menu maken

Een sub-menu toevoegen aan je bestaande menu doe je eenvoudig in 3 stappen. In dit voorbeeld heb ik het menu van WebMakkie gebruikt zoals dit op het moment van dit schrijven ingedeeld is.

Maak links om in je sub-menu te plaatsen
Gebruik een # als link voor de hoofd link
Sleep de nieuwe links onder de hoofd link

Deze website is gemaakt met WebMakkie

WebMakkie is de gratis website maker van WITXL.NL