Een vervolgkeuzemenu maken in WordPress (beginnershandleiding)

Wil je een dropdown menu maken en toevoegen aan je WordPress website?


Een vervolgkeuzemenu toont een lijst met links terwijl u uw muis over een item in het menu beweegt.

We gebruiken een vervolgkeuzemenu op WPBeginner, ga je gang en ga met je muis over het navigatiemenu bovenaan.

In deze beginnershandleiding laten we u zien hoe u eenvoudig een vervolgkeuzemenu in WordPress kunt maken met stapsgewijze instructies.

Een vervolgkeuzemenu maken in WordPress

Waarom dropdownmenu’s gebruiken in WordPress?

WordPress wordt geleverd met een ingebouwd menubeheersysteem waarmee u eenvoudig navigatiemenu’s aan uw WordPress-site kunt toevoegen.

Navigatiemenu’s zijn links naar de hoofdpagina’s van uw website die meestal bovenaan verschijnen als een horizontale rij naast het logo van de website.

Typisch navigatiemenu met een horizontale rij links

Als u een blog start of een website maakt met slechts een paar pagina’s, dan kunt u deze in één enkele rij toevoegen.

Als u echter een online winkel of een grote website heeft, wilt u misschien meer links toevoegen aan het navigatiemenu.

Dropdown-menu’s helpen u het probleem van beperkte ruimte op te lossen door menulinks alleen weer te geven wanneer gebruikers hun muis naar een bovenliggend item brengen. Ze stellen u ook in staat de menustructuur te ordenen op onderwerp of hiërarchie.

Voorbeeld dropdownmenu

Ten slotte zien ze er ook best goed uit.

Dat gezegd hebbende, laten we nu eens kijken hoe u eenvoudig WordPress dropdown-menu’s kunt maken die u aan uw website kunt toevoegen.

Video-instructies

Abonneer u op WPBeginner

Als je de video niet leuk vindt of meer instructies nodig hebt, lees dan verder.

Stap 1. Een thema kiezen met dropdownmenu-ondersteuning

WordPress wordt geleverd met een ingebouwd menubeheersysteem, maar het weergeven van die menu’s is volledig afhankelijk van uw WordPress-thema.

Bijna alle WordPress-thema’s ondersteunen standaard vervolgkeuzemenu’s. Sommige thema’s hebben echter mogelijk geen goede menuondersteuning.

U moet ervoor zorgen dat u een WordPress-thema gebruikt dat vervolgkeuzemenu’s ondersteunt.

Hoe weet u of het thema dat u gebruikt het vervolgkeuzemenu ondersteunt?

U kunt eenvoudig de website van het thema bezoeken, waar u een link naar de demo van het thema vindt. Van daaruit kunt u zien of de demo een vervolgkeuzemenu toont in het navigatiemenu.

Als dit niet het geval is, moet u een WordPress-thema vinden dat dat wel doet.

Zie onze gids over het kiezen van het perfecte WordPress-thema voor uw website.

Hier zijn een paar uitstekende thema’s die het vervolgkeuzemenu out-of-the-box ondersteunen.

  • Astra – Het is een multifunctioneel WordPress-thema dat wordt geleverd met verschillende startersites en tal van functies.
  • StudioPress-thema’s – Deze professionele thema’s zijn gebouwd bovenop het Genesis-themakader en zijn sterk geoptimaliseerd voor prestaties.
  • OceanWP – Een populair WordPress-thema dat geschikt is voor alle soorten websites.
  • Ultra – Powered by Themify builder dit WordPress-thema met slepen en neerzetten wordt geleverd met prachtige sjablonen en flexibele thema-opties.
  • Divi – populair thema van Elegant Themes dat de Divi-paginabuilder gebruikt en wordt geleverd met veel slepen & drop-functies, waaronder dropdown-menu’s.

Dat gezegd hebbende, laten we nu eens kijken hoe u een dropdown WordPress-menu kunt maken.

Stap 1. Een navigatiemenu maken in WordPress

Als u al een navigatiemenu op uw website heeft ingesteld, kunt u doorgaan naar de volgende stap.

Laten we eerst een eenvoudig menu maken.

Ga naar Uiterlijk »Menu’s pagina en klik bovenaan op de link ‘Een nieuw menu maken’.

Maak een menu

Vervolgens moet u een naam opgeven voor uw navigatiemenu. Deze naam is niet openbaar zichtbaar op uw website. Het doel van de menunaam is om u te helpen het menu in het WordPress-beheergebied te identificeren.

Menunaam

Voer een naam in voor uw menu en klik vervolgens op de knop ‘Menu maken’.

WordPress zal nu een nieuw leeg menu voor je maken.

Laten we de bovenste links toevoegen aan het navigatiemenu. Deze items verschijnen in de bovenste rij van uw menu.

Selecteer eenvoudig de pagina’s die u wilt toevoegen in de linkerkolom en klik op de knop ‘Toevoegen aan menu’. U kunt ook blogposts, categorieën selecteren of aangepaste links toevoegen.

Voeg pagina's toe aan het menu

Je ziet nu die pagina’s verschijnen in de rechterkolom onder je nieuwe menu.

Stap 2. Sub-items aan een menu toevoegen

Subitems zijn de items die in het vervolgkeuzemenu verschijnen. Afhankelijk van hoe u uw menu’s wilt ordenen, kunt u deze onder een van de bestaande items toevoegen.

Omwille van deze tutorial zullen we categorieën toevoegen onder de bloglink.

Selecteer eenvoudig de items die u wilt toevoegen in de linkerkolom en klik vervolgens op de knop ‘Toevoegen aan menu’. Je items verschijnen nu in de rechterkolom.

Nieuwe menu-items toegevoegd aan het menu

Deze links verschijnen echter als gewone items. We moeten ze een subitem maken van een bovenliggend menu.

U kunt eenvoudig een menu-item slepen en neerzetten en het onder het bovenliggende item plaatsen. Verplaats het een beetje naar rechts en het wordt een subitem.

Submenu-items toevoegen om een ​​vervolgkeuzemenu te maken

Herhaal het proces voor alle links die u onder het dropdown-menu wilt weergeven.

Als u klaar bent, vergeet dan niet op de knop ‘Menu opslaan’ te klikken om uw wijzigingen op te slaan.

Stap 3. Publiceer uw dropdownmenu

Als u een menu bewerkt dat al op uw website staat, wordt het meteen op uw website weergegeven.

Als het echter een nieuw menu-item is, moet u nu een themalocatie kiezen om dit menu weer te geven.

WordPress-thema’s kunnen menu’s op verschillende locaties weergeven. Elk thema definieert zijn eigen menulocaties en u kunt selecteren welk menu u daar wilt weergeven.

Je vindt deze optie in de rechterkolom onder ‘Menu-instellingen’. Selecteer een optie naast de instelling ‘Locatie weergeven’ en klik op de knop ‘Menu opslaan’.

Kies een themalocatie

U kunt nu uw website bezoeken om uw dropdown-menu in actie te zien.

Voorbeeld van dropdownmenu

Tips voor het maken van interactieve vervolgkeuzemenu’s

Navigatiemenu’s zijn belangrijk omdat dit de eerste plaats is waar uw gebruikers naar kijken als ze specifieke informatie willen zien.

Door ze correct te gebruiken, kunnen uw gebruikers hun weg op uw website vinden. Het helpt u ook om meer paginaweergaven, conversies en verkopen op uw website te krijgen.

Hier zijn een paar tips om uw navigatiemenu’s interactiever te maken met vervolgkeuzemenu’s.

1. U kunt vervolgkeuzemenu’s met meerdere niveaus maken

Door een link een subitem van een andere link te maken, verschijnt deze in het vervolgkeuzemenu. U kunt ook een subitem onder een ander subitem toevoegen om vervolgkeuzemenu’s met meerdere niveaus te maken.

Menu's met meerdere niveaus

Uw thema zou ze automatisch tonen als een submenu in de vervolgkeuzelijst.

Dropdownmenu op meerdere niveaus

2. U kunt ook meerdere vervolgkeuzemenu’s maken

U kunt een vervolgkeuzelijst maken onder elke bovenste link in uw menu. U kunt zelfs meerdere vervolgkeuzemenu’s toevoegen aan uw hoofdnavigatiemenu.

Meerdere vervolgkeuzemenu's in het primaire menu

3. Maak menu’s met een live preview

Als uw menu te ingewikkeld wordt, kunt u overschakelen naar het visuele voorbeeld. Ga naar Uiterlijk »Aanpassen om de live thema-aanpasser te starten.

Klik vanaf daar op het tabblad ‘Menu’s’ en selecteer vervolgens uw navigatiemenu. U ziet nu een menu-editor met slepen en neerzetten in de linkerkolom met een live voorbeeld van uw site in het rechterpaneel.

Pas WordPress-menu's aan met een live preview

4. Het creëren van een groot megamenu als dropdown in WordPress

De vervolgkeuzemenu’s tonen slechts één vervolgkeuzemenu tegelijk. Wat als u de volledige structuur van uw website wilt laten zien als een megamenu dat alleen verschijnt wanneer gebruikers in het hoofdmenu zweven?

Voorbeeld van een megamenu

Mega-menu’s verschijnen als een vervolgkeuzemenu, maar ze kunnen veel meer links, submenu’s en meer weergeven. Zie onze stapsgewijze zelfstudie voor het maken van een megamenu in WordPress voor gedetailleerde instructies.

We hopen dat dit artikel je heeft geleerd hoe je eenvoudig een vervolgkeuzemenu kunt maken in WordPress. Misschien wilt u ook onze gids zien hoe u een kleverig zwevend navigatiemenu maakt in WordPress en hoe u afbeeldingspictogrammen toevoegt aan navigatiemenu’s in WordPress.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map