Leder du efter en måde at skabe en fantastisk menu for at hjælpe med at forbedre dit websteds UI/UX? Hvis ja, så er du på det rigtige sted. Her har vi samlet en detaljeret guide til at hjælpe dig.
Først viser vi dig en trin-for-trin gennemgang af, hvordan du opretter en menu til dit WordPress-websted. Og når du først har fået styr på det, vil vi guide dig til, hvordan du bruger Elementor Navigation Menu-widgetten til at tilpasse og superlade din WordPress-menu.
Indholdsfortegnelse:
Det er vigtigt at vide, at navigationsmenuerne er vigtige ikke kun for at bringe trafik til dit websted, men også for bedre SEO-rangering.
Faktisk er nav-menuerne primært designet til brugerinddragelse, men dette er ikke det eneste formål.
Den næstvigtigste faktor er at holde øje med rollen som "WebCrawler" eller bots, der er designet til at crawle webstederne og indeksere indholdet til det relevante niveau og rapportere tilbage til søgemaskinen for at rangere indholdet det rigtige sted.
Derfor, hvis du laver for komplicerede menuer, så ville det være svært for bots at rangere dit indhold, men du vil også miste dine besøgende.
Kort sagt er "nem navigation" en afgørende bidragyder til at forbedre en bedre brugeroplevelse og spiller en afgørende rolle i at booste vores webstedsrangering og øge trafikken.
Det er en glimrende grund for mange virksomhedswebsteder til at beholde et enkelt navigationsikon i stedet for en kompleks menulinje, som indlæses op til en fuldskærmsmenu, når der klikkes på dem.
Takket være Elementor pro-widgetten med en 100 % responsiv navigationsmenu kan du skabe en pixel-perfekt og utrolig fleksibel menulinje uden at bruge nogen kode.
I denne vejledning vil vi demonstrere for dig, hvordan du bruger Elementor-navigationsmenu-widgetten til at få den tilpassede, avancerede WordPress-menu.
Før du starter med Elementor Navigation-widgetten, lad os undersøge, hvordan vi kan oprette en simpel WordPress-menu ved hjælp af Elementor gratis version.
Nu, for at oprette en WordPress-menu, behøver du ikke at installere nogen specielle plugin s. Som standard kommer WordPress med en brugervenlig menubygger, der hjælper dig med at oprette enkle navigationsmenuer til dit websted.
Når det er sagt, vil du ikke have adgang til nogen tilpasningsmuligheder for menuen. Det vil tage sig af designet af det aktuelt aktive WordPress-tema. Men hvis det er alt, hvad du ønsker, så er dette en glimrende måde at oprette en navigationsmenu til dit WordPress-websted.
Først og fremmest skal du logge ind på dit WordPress-backend-dashboard.
Gå nu fra venstre sidebjælke til Udseende > Menuer . Her finder du et layout med to kolonner med "Tilføj menupunkter" til venstre og "Menustruktur" til højre.
Under menustruktur finder du et felt til "Menunavn". Dette vil være navnet på den menu, vi vil oprette lige nu. Lad os kalde det Menu 1.
Bemærk : Bare rolig. Dine læsere vil ikke kunne se menunavnene. Det er en funktion, der hjælper dig med at holde alle dine forskellige menuer organiseret.
Når du har givet din menu et navn, skal du klikke på knappen "Opret menu" for at gøre den tilgængelig. Nu skal du tilføje de forskellige menupunkter.
Nu kommer den del, hvor du udfylder din nye menu med menupunkter. Under afsnittet "Tilføj menupunkter" til din venstre side finder du en organiseret liste over ting, som du kan tilføje til din menu.
Som standard indeholder dette alle dine sider, indlæg, landingssider, tilpassede links og kategorier.
vælg blot de menupunkter, du vil tilføje, ved at bruge afkrydsningsfeltet, og klik derefter på knappen "Tilføj til menu". Dette vil udfylde din menu med alle dine valgte menupunkter.
Bemærk : Bemærk, at hver sektion under "Tilføj menupunkter" har mulighed for at skifte mellem - Seneste , Vis alle og Søg . Husk at bruge disse muligheder, hvis der er mange varer.
Når du er færdig med at tilføje alle menupunkter, skal du trykke på knappen "Gem menu" og gå videre til næste trin.
Vidste du, at WordPress som standard også giver dig mulighed for at oprette undermenuer? Når du opretter undermenustrukturen, har du et overordnet menupunkt og et undermenupunkt.
Når en bruger svæver over det overordnede menupunkt, vil det afsløre alle de underordnede menupunkter gemt under det.
Cool ikke?
Nu for at oprette en undermenustruktur, er alt hvad du skal gøre at vælge et menupunkt, som du ønsker skal være på den overordnede menu. Træk og slip derefter alle de menupunkter, du ønsker som underordnede menupunkter, under den. Nu skal du bare trække den til højre, og du er færdig!
Nu hvor du har oprettet din nye menu og tilføjet undermenuer, er det tid til at administrere dens placering.
Øverst i din menueditor bør du bemærke en mulighed kaldet "Administrer placeringer." Klik på det, og noget lignende til følgende skærm skulle dukke op:
Nu vil de tilgængelige menuplaceringer afhænge af det tema, du har installeret. I dette amp har vi et tema, der understøtter 3 menuer.
Efter at have tildelt en menu til hver af de tilgængelige menuplaceringer, klik på "Gem ændringer", og det er det.
Du kender nu alle de grundlæggende menufunktioner, som WordPress tilbyder som standard. Men hvis du ønsker mere tilpasning og funktionalitet, så læs videre for at lære om Elementor Pro Nav Menu Widget.
Hvis du kan lide at tilføje en tilpasset nav'-menu til dit WordPress-websted, skal du bruge Elementor Pro-versionen. Elementor Pro-versionen kommer med Elementor nav-widget sammen med mange andre specielle funktioner såsom 300+ skabeloner, en temabygger, en popup-widget, WooCommerce-widgets og mange andre interessante funktioner.
Hvad er de specifikke nøglefunktioner i selve Nav Menu-widgetten? Her er en kort introduktion.
Du skal oprette en grundlæggende WordPress-menu, som vi har nævnt ovenfor, og derefter vil du tilpasse standard WordPress-menuen ved hjælp af pro-nav-menu-widgetten. Når du har oprettet den primære liste, så er næste trin at tilføje den til din ønskede placering, dvs.
Nu, når du er færdig med de grundlæggende indstillinger, lad os tilpasse menuen ved hjælp af nav-menu-widgetten.
I det øverste hjørne af indstillingssektionen er der tre muligheder tilgængelige; Indhold, stil og avanceret.
Layoutsektionen : du har tre muligheder Vandret, lodret eller en skjult harmonika.
Juster sektion : denne sektion hjælper dig med at justere menutekstelementerne; midten, højre eller venstre.
Animationssektion : denne sektion giver dig mulighed for at tilføje animationseffekter under, over eller dobbeltlinjeanimationseffekter. Du kan også gå efter rammen, baggrunden og subtile tekstanimationer.
Understregningsanimationerne er som følger:
På samme måde er der indrammet, overline, dobbelt linje, baggrund og tekstanimation. Hver af dem tilbyder deres eget sæt animationer, og du kan selv tjekke dem ud for at lære, hvad du får med dem.
Pointer sektion : vælg typen af pointer fra rullemenuen.
Undermenuindikatorsektion : Elementor-widgetten er spækket med mange undermenustilingsmuligheder. Hvor du ikke kun kan styre farven, stilen og også baggrunden for menuen.
Polstring og menuafstand: polstring kan hurtigt justeres. Du kan ændre den vandrette polstring for menu og undermenu, lodret polstring, mellemrum også højre, venstre og centreret justering.
Elementor nærmer sig menuafstand og polstring ekstremt godt. De arbejdede hårdt bag dørene for at sikre, at de kan bringe værktøjerne til udvikleren, så de nemt kan skabe det design, de tænker på.
Menuafstanden byder på mange muligheder, herunder:
Farvebaggrund og typografi : du kan få dit skræddersyede branded look ved hjælp af det ønskede farveskema og baggrundsfarve. Du kan også vælge de gennemsigtige eller semi-transparente menuindstillinger.
Som designer kan du lege med disse muligheder så meget du kan og sikre dig, at du designer baggrundene efter dine ønsker.
Mobil er en vigtig del af nettet, og derfor leverer Elementor-udviklere også værktøjer, så du også kan oprette navbaren til mobilen.
Elementor-widget giver dig fuld kontrol over mobile menuindstillinger på WordPress. Du kan styre mobilskærmvisningen med et separat sæt indstillinger for mobilskærme. Der er en mulighed for mobilskærmindstillinger nederst i Elementor-indstillingssektionen, hvor du kan se dine mobilskærmsindstillinger.
Kort sagt er Elementors mobile menufunktioner som nedenfor:
Responsiv navigation: Tilbyder responsiv positionering af menuen.
Menuen er en af de vigtigste funktioner på ethvert websted. Fordi det hjælper de besøgende med at gå gennem dit websted, og hvis du oprettede en liste smart, ville det hjælpe med at holde dine besøgende på dit websted i lang tid. Menuen er lige så vigtig som for ethvert websteds hele layout, sidehovedet og sidefodssektionen.
Derfor skal menu-widgetten være i stand til at levere dit unikke brand-look med alle de væsentlige funktioner. Elementor Navigation-widgetten kommer med funktionsrige muligheder, der giver kunderne mulighed for at tilpasse menusektionen, så den passer ind i dit brands stemme. Nu kan du bruge en skræddersyet, stilfuld menu på tværs af dit websted, på din landingsside, header eller enhver anden sektion, hvor du kan lide at vise den.
Et websteds sidehoveder og sidefødder er væsentlige elementer. I de fleste tilfælde giver overskriften navigation...
To af de mest populære WordPress-temaer på markedet er Astra og OceanWP. Professionel…
Oprettelse af et fremragende nyhedswebsted kræver ikke, at du bliver webdesigner. Vi…
Avis-temaet er et af de mest betydningsfulde WordPress-temaer designet af tagDiv, en...
Når det kommer til at oprette en online butik, er WooCommerce det perfekte plugin . Det…
En header er generelt det første, en person ser, når de besøger dit websted,...
Se kommentarer
Hola gracias por el post, cuando añado el nav menu no me aparece mi menú se queda solo un recuadro gris en el editor de elementor y si voy a la pagina donde lo tengo no aparece nada. Como puedo solucionarlo? tak
Hej! Normalt opstår dette problem, når din menu enten er tom eller ikke er gemt. Dobbelttjek venligst på WordPress-menusiden.
Hola, una consulta, cómo se puede dar la instrucción para cerrar automáticamente un submenu al abrir or other item del menu.
Tak.
Hej, undskyld jeg forstår ikke helt dit spørgsmål? Kan du specificere?
ciao quando le voci del submenù sono troppo lunghe come si riesce a dividerle su più righe ?
Hej, dette anbefales ikke, fordi navigationen ville være meget kompleks at læse, i dette tilfælde er det bedre en mega menustil
Menu w wersji mobilnej nie otwiera sie. Jak moge je utworzyc zeby wyswietlalo sie na telefonach?
Hej, visningen af mobilmenuen er automatisk, hvis du bruger Elementor-navigationswidgetten. Men du bør tjekke et indstillingskald "breakpoint" i menuindstillingerne. Dette er skærmstørrelsen, når din menu skifter.
Tôi dùng thằng này, mà trên destop tôi để chế độ Vandret mà nó không nằm ngang, nó cứ nằm dọc, tôi dùng tema. Có gì hỗ trợ mình với nhé.
Sziasztok, az miképp oldható meg, hogy egy vertikális menüben az almenüre kattintás után ne zárja össze a menut az oldal betöltésekor? EPro
Hej, det er desværre ikke muligt, der er ingen sådan mulighed i Elementor nav-widget.
Ciao. Vorrei sapere se è possibile billetpris i modo che il menu rimanga semper visibile anche quando si scende con la visualizzazione della pagina. Purtroppo tutte le volte che ci ho provato il menu scende ma il farve di baggrund del menu ingen rendendolo praticamente illegibile le scritte. Grazie