Bent u op zoek naar een manier om een geweldig menu te maken om de UI/UX van uw website te helpen verbeteren? Als dat zo is, dan bent u bij ons aan het juiste adres. Hier hebben we een gedetailleerde gids samengesteld om u te helpen.
Eerst laten we u stapsgewijs zien hoe u een menu voor uw WordPress-website kunt maken. En zodra u dat onder de knie heeft, zullen we u begeleiden bij het gebruik van de Elementor Navigatiemenu-widget om uw WordPress-menu aan te passen en te verbeteren.
Inhoudsopgave:
Het is van cruciaal belang om te weten dat de navigatiemenu's niet alleen belangrijk zijn om verkeer naar uw site te halen, maar ook voor een betere SEO-ranking.
De navigatiemenu's zijn inderdaad in de eerste plaats ontworpen voor gebruikersbetrokkenheid, maar dit is niet het enige doel.
De tweede belangrijkste factor is het in het oog houden van de rol van “WebCrawler” of Bots die zijn ontworpen om de websites te crawlen en de inhoud naar het relevante niveau te indexeren en terug te rapporteren aan de zoekmachine om de inhoud op de juiste plaats te rangschikken.
Als u dus te ingewikkelde menu's maakt, is het voor de bots moeilijk om uw inhoud te rangschikken, maar raakt u ook uw bezoekers kwijt.
Kortom, “navigatiegemak” levert een cruciale bijdrage aan het verbeteren van een betere gebruikerservaring en speelt ook een cruciale rol bij het verbeteren van de ranking van onze site en het stimuleren van het verkeer.
Het is voor veel zakelijke websites een uitstekende reden om één navigatiepictogram te behouden in plaats van een complexe menubalk, die wordt geladen in een menu op volledig scherm wanneer erop wordt geklikt.
Dankzij de Elementor pro-widget met een 100% responsive navigatiemenu, kun je een pixel-perfecte en ongelooflijk flexibele menubalk creëren zonder code te gebruiken.
In deze zelfstudie laten we u zien hoe u de Elementor-navigatiemenuwidget om het aangepaste, geavanceerde WordPress-menu te krijgen.
Laten we, voordat we beginnen met de Elementor-navigatiewidget, onderzoeken hoe we een eenvoudig WordPress-menu kunnen maken met de gratis versie van Elementor.
Om een WordPress-menu te maken, hoeft u geen speciale plugin te installeren. Standaard wordt WordPress geleverd met een gebruiksvriendelijke menubouwer, waarmee u eenvoudige navigatiemenu's voor uw website kunt maken.
Dat gezegd hebbende, heb je geen toegang tot aanpassingsopties voor het menu. Het neemt het ontwerp over van het momenteel actieve WordPress-thema. Maar als dat alles is wat u wilt, dan is dit een uitstekende manier om een navigatiemenu voor uw WordPress-website in te stellen.
Allereerst moet u inloggen op uw WordPress-backend-dashboard.
Ga nu vanuit de linkerzijbalk naar Weergave > Menu's . Hier vindt u een lay-out met twee kolommen met links ‘Menu-items toevoegen’ en rechts ‘Menustructuur’.
Onder Menustructuur vindt u een veld voor de ‘Menunaam’. Dit wordt de naam voor het menu dat we nu gaan maken. Laten we het Menu 1 noemen.
Let op : Maak je geen zorgen. Uw lezers kunnen de menunamen niet zien. Het is een functie waarmee u al uw verschillende menu's georganiseerd kunt houden.
Nadat u uw menu een naam heeft gegeven, klikt u op de knop “Menu maken” om het beschikbaar te maken. Nu moet u de verschillende menu-items toevoegen.
Nu komt het gedeelte waarin u uw nieuwe menu vult met menu-items. Onder het gedeelte 'Menu-items toevoegen' aan de linkerkant vindt u een georganiseerde lijst met dingen die u aan uw menu kunt toevoegen.
Standaard bevat dit al uw pagina's, berichten, landingspagina's, aangepaste links en categorieën.
Selecteer gewoon de menu-items die u wilt toevoegen met behulp van het selectievakje en klik vervolgens op de knop "Toevoegen aan menu". Hierdoor wordt uw menu gevuld met al uw geselecteerde menu-items.
Opmerking : Merk op dat elke sectie onder “Menu-items toevoegen” de optie heeft om te schakelen tussen – Meest recent , Alles weergeven en Zoeken . Vergeet niet deze opties te gebruiken als er veel items zijn.
Zodra u klaar bent met het toevoegen van alle menu-items, klikt u op de knop “Menu opslaan” en gaat u door naar de volgende stap.
Wist u dat u met WordPress standaard ook submenu's kunt maken? Bij het maken van de submenustructuur beschikt u over een bovenliggend menu-item en een onderliggend menu-item.
Wanneer een gebruiker over het bovenliggende menu-item zweeft, worden alle onderliggende menu-items zichtbaar die eronder verborgen zijn.
Cool toch?
Om nu een submenustructuur te maken, hoeft u alleen maar een menu-item te kiezen dat u in het bovenliggende menu wilt plaatsen. Sleep vervolgens alle menu-items die u als onderliggende menu-items eronder wilt hebben. Sleep het nu gewoon naar rechts en je bent klaar!
Nu je je nieuwe menu hebt gemaakt en submenu's hebt toegevoegd, is het tijd om de locatie ervan te beheren.
Bovenaan uw menu-editor zou u een optie moeten zien met de naam 'Locaties beheren'. Klik erop en iets dat lijkt op het volgende scherm zou moeten verschijnen:
De beschikbare menulocaties zijn nu afhankelijk van het thema dat u hebt geïnstalleerd. In dit amp hebben we een thema dat 3 menu's ondersteunt.
Nadat u een menu aan elk van de beschikbare menulocaties heeft toegewezen, klikt u op "Wijzigingen opslaan" en dat is alles.
U kent nu standaard alle basismenufuncties die WordPress biedt. Als u echter meer maatwerk en functionaliteit wilt, lees dan verder voor meer informatie over de Elementor Pro Nav Menu Widget.
Als je een aangepast navigatiemenu aan je WordPress-site wilt toevoegen, heb je de Elementor Pro-versie nodig. De Elementor Pro-versie wordt geleverd met de Elementor-navigatiewidget en vele andere speciale functies, zoals meer dan 300 sjablonen, een themabouwer, een pop-upwidget, WooCommerce-widgets en vele andere interessante functies.
Wat zijn de specifieke belangrijkste kenmerken van de Nav Menu-widget zelf? Hier is een korte introductie.
U moet een eenvoudig WordPress-menu maken, zoals we hierboven hebben vermeld, en vervolgens kunt u het standaard WordPress-menu aanpassen met behulp van de pro-nav-menu-widget. Nadat u de primaire lijst heeft gemaakt, is de volgende stap het toevoegen van deze aan de gewenste locatie, bijvoorbeeld de kopsectie.
Als u nu klaar bent met de basisinstellingen, gaan we het menu aanpassen met behulp van de navigatiemenuwidget.
In de bovenste hoek van het instellingengedeelte zijn drie opties beschikbaar; Inhoud, stijl en geavanceerd.
Het gedeelte Lay-out : je hebt drie opties Horizontaal, verticaal of een verborgen vervolgkeuzelijst.
Sectie uitlijnen : deze sectie helpt u bij het uitlijnen van de menutekstitems; midden, rechts of links.
Animatiesectie : in deze sectie kunt u animatie-effecten toevoegen onder, boven of dubbele lijnanimatie-effecten. Je kunt ook kiezen voor het frame, de achtergrond en subtiele tekstanimaties.
De onderstreepte animaties zijn als volgt:
Op dezelfde manier zijn er ingelijste, bovenlijn-, dubbele lijn-, achtergrond- en tekstanimaties. Elk van hen biedt zijn eigen reeks animaties en je kunt ze zelf bekijken om te zien wat je ermee krijgt.
Aanwijzersectie : selecteer het type aanwijzer in het vervolgkeuzemenu.
Submenu-indicatorsectie : de Elementor-widget zit boordevol vele submenu-stijlopties. Waar je niet alleen de kleur, stijl en ook de achtergrond van het menu kunt bepalen.
Opvulling en menu-afstand: de opvulling kan snel worden aangepast. U kunt de horizontale opvulling voor menu en submenu, de verticale opvulling en de tussenruimte ook de rechter-, linker- en gecentreerde uitlijning wijzigen.
Elementor benadert de menu-afstand en opvulling buitengewoon goed. Ze hebben achter de deuren hard gewerkt om ervoor te zorgen dat ze de tools naar de ontwikkelaar kunnen brengen, zodat ze gemakkelijk het ontwerp kunnen maken waar ze aan denken.
De menu-afstand biedt veel opties, waaronder:
Achtergrondkleur en typografie : u kunt uw merklook op maat creëren met behulp van het gewenste kleurenschema en de achtergrondkleur. U kunt ook de transparante of semi-transparante menu-opties kiezen.
Als ontwerper kun je zoveel mogelijk met deze opties spelen en ervoor zorgen dat je de achtergronden naar eigen wens ontwerpt.
Mobiel is een belangrijk onderdeel van internet en daarom bieden Elementor-ontwikkelaars ook tools waarmee je ook de navigatiebalk voor mobiel kunt maken.
Met de Elementor-widget heeft u volledige controle over mobiele menu-opties op WordPress. U kunt de mobiele schermweergave beheren met een aparte set instellingen voor schermen die alleen voor mobiel zijn. Er is een optie voor mobiele scherminstellingen onderaan het Elementor-instellingengedeelte, waar u uw mobiele schermopties kunt bekijken.
Kort gezegd zijn de mobiele menufuncties van de Elementor als volgt:
Responsieve navigatie: Biedt responsieve positionering van het menu.
Het menu is een van de belangrijkste kenmerken van elke website. Omdat het de bezoekers helpt om door uw website te lopen en als u slim een lijst maakt, helpt het om uw bezoekers lang op uw site te houden. Het menu is net zo belangrijk als dat van de volledige lay-out van elke website, de koptekst en het voettekstgedeelte.
Daarom moet de menuwidget in staat zijn om uw unieke merkuitstraling te leveren met alle essentiële functies. De Elementor-navigatiewidget wordt geleverd met functierijke mogelijkheden waarmee klanten het menugedeelte kunnen aanpassen aan de stem van uw merk. Nu kunt u een op maat gemaakt, stijlvol menu gebruiken op uw website, op uw landingspagina, header of op een andere sectie waar u het wilt weergeven.
De kop- en voetteksten van een website zijn essentiële elementen. In de meeste gevallen biedt de kop navigatie...
Twee van de meest populaire WordPress-thema’s op de markt zijn Astra en OceanWP. Professioneel…
Voor het maken van een uitstekende nieuwswebsite hoeft u geen webdesigner te worden. Wij…
Het krantenthema is een van de belangrijkste WordPress-thema's ontworpen door tagDiv, een…
Als het gaat om het opzetten van een online winkel, is WooCommerce de go-to plugin . Het…
Een header is over het algemeen het eerste dat iemand ziet wanneer hij of zij uw website bezoekt,…
Bekijk opmerkingen
Met dank aan de post, terwijl de navigatiemenu's mij niet verschijnen, is het alleen een zoekactie in de elementredacteur en zie ik de pagina niet meer verschijnen. Wat is de oplossing? bedankt
Hoi! Meestal treedt dit probleem op als uw menu leeg is of niet is opgeslagen. Controleer nogmaals aan de WordPress-menuzijde.
Tijdens een consult kan de instructie worden gegeven om automatisch een submenu te openen op een ander menuitem.
Bedankt.
Hallo, sorry dat ik uw vraag niet helemaal begrijp? Kunt u dit specificeren?
als de stem van de submenù als een grote scheidslijn komt?
Hallo, dit wordt niet aanbevolen omdat de navigatie erg complex zou zijn om te lezen. In dit geval is het beter een megamenustijl
Menu met mobiele telefoons is niet anders. Heeft u misschien iets aan uw telefoon gehad?
Hallo, de mobiele menuweergave is automatisch als u de Elementor-navigatiewidget gebruikt. Maar u moet een instellingsoproep "breekpunt" in de menu-instellingen controleren. Dit is de schermgrootte waarop uw menu schakelt.
Als je dat wilt, kun je het beste horizontaal kijken, maar niet als je een thema wilt creëren. Het is goed om te weten dat het goed is.
Als de oude mensen denken dat ze een verticale weergave zijn van almen, is het niet de bedoeling dat ze een oude weddenschap aangaan? EPro
Hallo, helaas is dat niet mogelijk. Een dergelijke optie bestaat niet in de Elementor-navigatiewidget.
Ciao. Omdat dit een mogelijk tarief is in de modus dat het menu semper semper zichtbaar is als het met de visuele weergave van de pagina wordt weergegeven. Als u wilt dat u het menu laat zien, wordt de achtergrondkleur van het menu niet weergegeven als het script onleesbaar is. Grazie