shopify partner social pepper

Dit is een blog van Social Pepper

Een mega menu maken met Elementor

Je kunt sinds kort een mega menu maken met Elementor. Je kent ze vast wel, bv op een website zoals Coolblue of Bol. Van die hele grote uitklapbare menu’s met soms ook nog een afbeelding er in.

In dit blog een stap voor stap uitleg hoe je met Elementor zo’n menu kunt maken. We gaan er wel vanuit dat je Elementor kent en al eens gewerkt heb met de Elementor widgets. Here we go!

  1. Als eerste heb je Elementor Pro nodig met een licentie. Die kun je hier aanschaffen: https://elementor.com/pricing-plugin/
  2. In de laatste versie van Elementor dien je de volgende elementen te activeren bij Elementor > Instellingen > Functies: Flexbox container, geneste elementen en menu.
  3. Na stap 2 kun je via de Themebuilder of het maken van een template een (nieuwe) header maken.
  4. Door de acties bij stap 2. heb je nu een menu widget en een WordPress menu widget tot je beschikking. We nemen eerst de menu widget en plaatsen deze in de lege kolom. Je ziet dat Elementor automatisch hier item1, item2 en item3 in het menu heeft geplaatst.
  5. Onder het tabblad “Inhoud” kun je ‘dropdown content’ activeren. Hierdoor verschijnt er automatisch een dropdown arrow naast het menu item. Je kunt hier ook de titel van het menu item wijzigen en dynamisch een link koppelen naar een websitepagina. Zo kun je dus een menu item ‘Home’ maken en daar dan een link aan koppelen naar je Homepage.
  6. Door activatie van de dropdown content optie geeft Elementor je automatisch een nieuwe, lege container. En hier kun je dan van alles mee doen! Nieuwe kolommen toevoegen, een submenu toevoegen en afbeeldingen toevoegen. Dit werkt in principe op dezelfde manier zoals andere kolommen en widgets toevoegen op een pagina. Hiermee kun je dan dus jouw mega menu aankleden zoals je zelf wilt!

Zie hier enkele screenshots om bovenstaande te verduidelijken.

Hierboven zie je hoe d.m.v. een menu widget een websitepagina kunt koppelen aan een menu item en hoe je dit menu item een willekeurige naam kunt geven.

Bij het screenshot hieronder zie je hoe je, door “dropdown content’ te activeren een nieuwe container tot je beschikking krijgt waar je kolommen kunt maken met afbeeldingen, teksten, menu’s, etc.

Vergeleken met de aanschaf vaneen extra plugin om een mega menu te maken, maakt Elementor het ons een stuk gemakkelijker door deze optie nu standaard aan Elementor pro toe te voegen.

(Technische) hulp nodig?

Heb je hulp nodig om bovenstaand onderwerp op te lossen? Geen probleem! Social Pepper kan je helpen, als het gaat om Elementor, WordPress of Shopify. Hulp nodig? Neem dan contact met ons op. Of bel 0031611210036!

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *