En välstrukturerad navigeringsmeny är avgörande för att guida besökare genom din WordPress-webbplats och säkerställa att de enkelt kan hitta den information de behöver.
Oavsett om du sätter upp din första webbplats eller försöker förbättra användarupplevelsen på en befintlig, är det en viktig färdighet att lära sig hur man lägger till och anpassar en navigeringsmeny.
WordPress levereras med ett dra-och-släpp-menygränssnitt som du kan använda för att enkelt skapa huvudmeny, menyer med rullgardinsalternativ och mycket mer.
Under åren har vi skapat en mängd olika menyer för våra olika varumärken, vilket ger oss förstahandserfarenhet av att designa menystilar. Vi har lärt oss vilka typer av menyer som fungerar bäst för olika företag, vilka länkar och sidor som ska inkluderas och hur man optimerar navigeringen för en bättre användarupplevelse.
I den här steg-för-steg-guiden visar vi hur du enkelt lägger till en navigeringsmeny i WordPress.
Vad är en navigeringsmeny?
En navigeringsmeny är en lista med länkar som pekar på viktiga områden på en webbplats. De presenteras vanligtvis som en horisontell stapel med länkar överst på varje sida på en WordPress-webbplats.
Dessa menyer ger din webbplats struktur och hjälper besökare att hitta det de letar efter. Så här ser navigeringsmenyn ut på WPBeginner:
WordPress gör det väldigt enkelt att lägga till menyer och undermenyer. Du kan lägga till länkar till dina viktigaste sidor, kategorier eller ämnen, blogginlägg och till och med anpassade länkar som din profil på sociala medier.
Den exakta platsen för din meny beror på ditt WordPress-tema. De flesta teman har flera alternativ, så du kan skapa olika menyer som kan visas på olika platser.
Till exempel har de flesta WordPress-teman en primär meny som visas högst upp. Vissa teman kan också inkludera en sekundär meny, en sidfotsmeny eller en mobilnavigeringsmeny.
Med det sagt, låt oss se hur du kan skapa en anpassad navigeringsmeny i WordPress.
- Skapa din första anpassade navigeringsmeny
- Skapa rullgardinsmenyer i WordPress
- Lägga till kategorier i WordPress-menyer
- Lägga till anpassade länkar i dina WordPress-navigeringsmenyer
- Redigera eller ta bort ett menyalternativ i WordPress navigeringsmenyer
- Lägga till navigeringsmenyer i Full Site Editor (FSE)
- Lägga till WordPress-menyer i sidofält och sidfötter
- Vidare med navigeringsmenyer
- Videohandledning
- Vanliga frågor om WordPress-menyer
Skapa din första anpassade navigeringsmeny
För att skapa en navigeringsmeny måste du besöka sidan Utseende » Menyer i din WordPress adminpanel.
Notera: Om du inte ser alternativet 'Utseende » Menyer' på din webbplats och bara ser 'Utseende » Redigerare', betyder det att ditt tema har Full Site Editing (FSE) aktiverat. Du kan klicka här för att hoppa till FSE-avsnittet nedan.
När du är där, ange ett namn för din meny, som 'Toppnavigeringsmeny', och klicka sedan på knappen 'Skapa meny'.
Detta kommer att utöka menyområdet, och det kommer att se ut så här:
Därefter kan du välja vilka sidor du vill lägga till i menyn. Du kan antingen automatiskt lägga till alla nya sidor på toppnivå eller välja specifika sidor från den vänstra kolumnen.
Klicka först på fliken 'Visa alla' för att se alla dina webbplatsens sidor. Klicka sedan på rutan bredvid varje sida du vill lägga till i din meny och klicka sedan på knappen 'Lägg till i meny'.
När dina sidor har lagts till kan du flytta runt dem genom att dra och släppa dem i avsnittet 'Menystruktur'.
På så sätt kan du ändra deras ordning och ordna om dem.
Notera: Alla menyalternativ listas i en vertikal (uppifrån och ner) lista i menyredigeraren. När du publicerar menyn på din webbplats kommer den antingen att visas vertikalt eller horisontellt (vänster till höger), beroende på vilken plats du väljer.
De flesta teman har flera olika platser där du kan placera menyer. I det här exemplet använder vi Astra-temat, som har 5 olika platser.
Efter att ha lagt till sidor i menyn, välj var du vill visa den och klicka på knappen 'Spara meny'.
Tips: Om du är osäker på var varje plats är, prova att spara menyn på olika platser och besök sedan din webbplats för att se hur den ser ut. Du vill förmodligen inte använda alla platser, men du kanske vill använda mer än en.
För mer information om detta kan du vilja se vår handledning om hur man skapar en vertikal navigeringsmeny i WordPress.
Här är vår färdiga meny på webbplatsen:
Skapa rullgardinsmenyer i WordPress
Rullgardinsmenyer, ibland kallade kapslade menyer, är navigeringsmenyer med överordnade och underordnade menyalternativ.
När du för muspekaren över ett huvudobjekt visas alla underordnade objekt under det i en undermeny.
För att skapa en undermeny, dra ett objekt under föräldraobjektet och dra det sedan lite åt höger. Vi har gjort det med 3 underobjekt under 'Tjänster' i vår meny:
Du kan till och med lägga till flera lager av rullgardinsmenyer så att din undermeny kan ha en undermeny. Detta kan bli lite rörigt, och många teman stöder inte rullgardinsmenyer med flera lager.
För mer detaljerade instruktioner, se vår guide om hur man skapar en rullgardinsmeny i WordPress.
Här är undermenyn live på vår demosida:
Lägga till kategorier i WordPress-menyer
Om du använder WordPress för att driva en blogg, kanske du vill lägga till dina bloggkategorier som en rullgardinsmeny i din WordPress-meny.
Vi gör detta på WPBeginner och har flera kategorier som nyheter, teman, handledningar och mer.
Du kan enkelt lägga till kategorier i din meny genom att klicka på fliken Kategorier på vänster sida av menyskärmen. Du kan också behöva klicka på fliken 'Visa alla' för att se alla dina kategorier.
Välj helt enkelt de kategorier du vill lägga till i menyn och klicka sedan på knappen 'Lägg till i meny'.
Kategorierna kommer att visas som vanliga menyalternativ längst ner i din meny.
Därefter kan du dra och släppa dem på plats. Vi kommer till exempel att placera alla dessa kategorier under menyalternativet Blogg.
För ytterligare instruktioner, se vår nybörjarguide om hur man lägger till ämnen i WordPress navigeringsmenyer.
Så här visas olika kategorier i navigeringsmenyn på vår demosida:
Lägga till anpassade länkar i dina WordPress-navigeringsmenyer
Förutom kategorier och sidor gör WordPress det också superenkelt att lägga till anpassade länkar i din meny. Du kan använda det för att länka till dina sociala medieprofiler, din onlinebutik och andra webbplatser som du äger.
För att göra detta måste du använda fliken 'Anpassade länkar' på menyskärmen. Lägg helt enkelt till länken tillsammans med den text du vill använda i din meny och klicka på knappen 'Lägg till i meny'.
Du kan till och med vara kreativ och lägga till sociala medieikoner i din meny eller knappar för uppmaning till handling för att få fler konverteringar.
Redigera eller ta bort ett menyalternativ i WordPress navigeringsmenyer
När du lägger till sidor eller kategorier i din anpassade navigeringsmeny använder WordPress sidtiteln eller kategorinamnet som länktext. Du kan ändra detta om du vill.
Alla menyalternativ kan redigeras genom att klicka på nedåtpilen bredvid dem.
Du kan sedan ändra namnet på menyalternativet härifrån. Du kan också klicka på 'Ta bort' för att ta bort länken från din meny helt.
Om du har problem med dra-och-släpp-gränssnittet kan du också flytta menyalternativet genom att klicka på lämplig 'Flytta'-länk.
Lägga till navigeringsmenyer i Full Site Editor (FSE)
Den nya redigeraren för hela webbplatsen låter dig anpassa dina WordPress-teman med hjälp av blockredigeraren. Den släpptes i WordPress 5.9 och gör det möjligt för dig att lägga till olika block i dina mallar för att skapa en unik design.
För att lägga till en navigeringsmeny med hjälp av hela webbplatsredigeraren, besök Utseende » Redigerare från din WordPress-instrumentpanel.
Vi kommer att använda standardtemat Twenty Twenty-Three för den här handledningen. För mer information kan du se vår artikel om de bästa WordPress-teman för fullständig webbplatsredigering.
När du är i redigeraren, klicka på fliken 'Navigation' för att expandera den.
Detta öppnar nya inställningar i den vänstra kolumnen.
Härifrån klickar du helt enkelt på 'Redigera'-ikonen högst upp.
Detta startar redigeraren för hela webbplatsen på din skärm, där du kan klicka på ikonen '+' för att lägga till ett navigeringsmenyobjekt.
En prompt öppnas nu, och du kan välja ett alternativ från rullgardinsmenyn.
Om du däremot vill lägga till en anpassad länk kan du lägga till en etikett och en URL för navigeringsmenyobjektet i blockpanelen. Du kan också lägga till ett sökalternativ i din meny.
När du har lagt till ett objekt, byt till fliken 'Stilar' från kolumnen till höger.
Du kan nu ändra typografi, utseende, höjd, avstånd, gemener/versaler och textdekorering för dina menyalternativ.
Du kan också lägga till en undermeny genom att klicka på dess ikon i blockets verktygsfält.
När du är klar kan du förhandsgranska ändringarna för att se hur menyn ser ut i realtid. Glöm sedan inte att klicka på knappen 'Spara' högst upp.
Lägga till WordPress-menyer i sidofält och sidfötter
Du behöver inte bara hålla dig till visningsplatserna för ditt tema. Du kan lägga till navigeringsmenyer i vilket område som helst som använder widgets, som din sidofält eller sidfot.
Gå helt enkelt till Utseende » Widgetar och klicka sedan på knappen 'Lägg till block' (+) högst upp och lägg till blocket 'Navigeringsmeny' widgetblock till din sidofält.
Lägg sedan till en titel för widgeten och välj rätt meny från listrutan 'Välj meny'.
När du är klar klickar du helt enkelt på knappen 'Uppdatera'.
Här är ett exempel på en anpassad WordPress-sidfotsmeny byggd på vår grundare, Syed Balkhis webbplats.
Vidare med navigeringsmenyer
Om du vill skapa en riktigt episk meny med massor av länkar, har vi en handledning om hur man skapar en megameny i WordPress.
Detta låter dig skapa en rullgardinsmeny med många objekt, inklusive bilder.
Megamenyer är ett utmärkt alternativ om du har en stor webbplats, som en onlinebutik eller nyhetssajt. Den här typen av meny används av webbplatser som Reuters, Buzzfeed, Starbucks, etc.
Videohandledning
Om du hellre vill titta på den här handledningen, kolla in vår video nedan:
Vanliga frågor om WordPress-menyer
Här är några av de vanligaste frågorna som nybörjare ställer om WordPress navigeringsmenyer.
1. Hur lägger jag till en startsidelänk i en WordPress-meny?
För att lägga till din startsida i en navigeringsmeny måste du klicka på fliken 'Visa alla' under Sidor. Därifrån bör du se din startsida.
Markera rutan bredvid 'Hem' och klicka på 'Lägg till i meny'. Kom ihåg att spara dina ändringar.
2. Hur lägger jag till flera navigeringsmenyer i WordPress?
I WordPress kan du skapa så många menyer du vill. För att placera en meny på din webbplats måste du lägga till den i en av ditt temas menyplatser eller i ett widgetområde, som vi visade ovan.
Om du vill lägga till flera navigeringsmenyer på din WordPress-webbplats, skapa först menyerna enligt vår handledning ovan.
För att placera dem på din webbplats, klicka på fliken 'Hantera platser'.
Härifrån kan du välja vilken meny du vill visa på de menyplatser som finns tillgängliga i ditt tema.
Om du vill lägga till en ny menyplats på din webbplats, se vår handledning om hur du lägger till anpassade navigeringsmenyer i WordPress-teman.
Vi hoppas att den här artikeln hjälpte dig att lära dig hur du lägger till en navigeringsmeny i WordPress. Du kanske också vill kolla in våra guider om hur du stylar navigeringsmenyer i WordPress och hur du skapar en klibbig flytande navigeringsmeny i WordPress.
Om du gillade den här artikeln, prenumerera då på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.
Jazz
Hej, tack för den här handledningen. Jag har fortfarande ett problem som jag inte kan lösa. I min navigeringsmeny finns det två länkar längst upp till höger: Meny och Kontakt. Jag skulle vilja lägga till en tredje och fjärde länk (till vänster om Kontakt) men på något sätt kan jag inte få det att fungera. Det som händer är att Kontakt försvinner och istället dyker den nya länken (till exempel Tjänst) upp. Är detta ett vanligt problem som kan lösas enkelt utan plugins?
WPBeginner Support
Det låter som att detta kan vara ett stylingproblem med ditt specifika tema. Om du kontaktar ditt temas support bör de kunna titta på det och hjälpa till!
Admin
Jazz
Det ska jag göra, tack så mycket för ditt svar!
Dennis Muthomi
vad dina tankar är om att ha en klibbig navigeringsmeny? rekommenderar du att ha en klibbig eller en icke-klibbig?
WPBeginner Support
It is mostly a question of personal preference. There is not specifically better option between the two. At the moment we use a static menu instead of sticky
Admin
Dayo Olobayo
Detta var precis vad jag behövde. Jag har velat få min webbplats att se mer professionell ut och att lägga till en navigeringsmeny är en stor del av det. Tack för de tydliga instruktionerna!
Jiří Vaněk
Angående att lägga till sidor i menyn, vet inte hur jag ska lösa sökproblemet? Eller om du inte har stött på det. Jag har en webbplats där det för närvarande finns cirka 600 sidor, som främst används för ordboksändamål. Problemet är, när jag vill lägga till en av sidorna i menyn, skriver jag dess länk i sökningen, så hittar inte wordpress den och jag måste först visa alla och hitta den i alfabetisk ordning. Det försenar mitt arbete ganska mycket och jag har inte kommit på var problemet ligger.
WPBeginner Support
Du skulle vilja försöka skriva titeln på sidan, annars kan du använda anpassade länkar och länka till sidan om du har URL:en direkt.
Admin
Jiří Vaněk
Ja, det gör jag. Jag skriver in webbplatsnamnet i sökrutan och WordPress listar liknande webbplatser, men vanligtvis inte den jag letar efter. Så jag kommer att undersöka vidare var problemet kan ligga.
David Keevis
Tack så mycket för en riktigt utmärkt handledning. Vi bygger vår webbplats med flera CPT:er och det här inlägget förklarade tydligt vad som behövdes. Hade det implementerat på ett par minuter. Vi använder Generate Press/Generate Blocks och frågeloopen är exceptionellt kraftfull. Ni gjorde verkligen vår dag!!!!
WPBeginner Support
Kul att höra att vår guide hjälpte!
Admin
NPH LLC
Om jag "tar bort" en länk i min huvudsakliga navigeringsmeny, kan jag enkelt få tillbaka den? Vi vill ta en sida offline medan vi konfigurerar om den.
Tack!
WPBeginner Support
Ja, du kan enkelt lägga till och ta bort menyalternativ och om menyalternativen även om objektet inte finns i menyn för närvarande. Du bör se till att rensa all cache på din webbplats så att dina besökare ser den uppdaterade menyn.
Admin
Akanksha
Tack ..Det här var till stor hjälp för mig
WPBeginner Support
Kul att det var till hjälp!
Admin
Sunny
En väldigt grundläggande fråga. Hur kan man länka sin webbplats URL till sin startsida? Det vill säga, att webbplatsens URL också är din startsidessektion i menyn. Tack
WPBeginner Support
Du kan antingen ställa in menyn till startsidan som du har angett under Inställningar>Allmänt för din webbplats eller skapa en anpassad URL och lägga till din domän där för att peka på din startsida.
Admin
Lisa
Jag är förvirrad över hur jag får mina inlägg att hamna där jag vill att de ska vara… Jag har en receptblogg. Överst på min webbplats har jag kategorier som du kan klicka på, som ”Middagsrecept” och ”Tillbehör”… Hur får jag mina specifika inlägg att hamna på dessa specifika sidor när man klickar på titeln högst upp på sidan?
abär
Finns det ett sätt att när man lägger till en kategori så läggs underkategorierna automatiskt till?
WPBeginner Support
Du kanske vill titta på en av våra äldre artiklar som täcker detta nedan för att visa underkategorier på föräldrakategorisidan:
https://www.wpbeginner.com/wp-tutorials/display-subcategories-on-category-pages-in-wordpress/
Admin
HJ
Mycket grundläggande fråga, men hur aktiverar jag menyn på en undersida? Jag har designat några undersidor, men menyn syns inte högst upp. På mina huvudsidor syns menyn. Hur aktiverar jag menyn för att göra den synlig på undersidorna?
WPBeginner Support
Du skulle vilja kontakta supporten för ditt specifika tema, det låter som att ditt tema kan ta bort menyn för vissa sidor. Om du kontaktar supporten bör de kunna berätta hur du lägger till menyn igen.
Admin
Janien
Jag försöker få en navigeringsmeny som är klistrig och inte transparent. Jag har provat allt. Får jag ändra navigeringsfältet i ett tema?
WPBeginner Support
Det kan du, men det skulle kräva lite kodningskunskap. Vi rekommenderar att du kontaktar ditt temas support, de kan normalt hjälpa till.
Admin
Miranda
Jag har skapat en navigeringsmeny men den visas inte på mobilwebbplatsen och när jag går till inställningarna för navigeringsmenyn finns inte mobilmeny som ett alternativ. Vet du hur jag kan fixa detta eller behöver jag hitta ett annat tema?
WPBeginner Support
Du måste kontakta supporten för ditt specifika tema för att det inte visas korrekt och de skulle kunna hjälpa till.
Admin
sadik
Tack Wp Begginer
WPBeginner Support
You’re welcome
Admin
Nanyc
Detta hjälpte mycket. Jag ville ha en förvarning innan jag började. Presenterat mycket bra.
WPBeginner Support
Glad our article was helpful
Admin
atta
Tack för den detaljerade guiden. Jag har en fråga: hur kan vi lägga till en navigeringsmeny (för en landningssida) som länkar till sektioner/element på landningssidan istället för att navigera till andra sidor. Ett exempel är Wikipedia. På vilken Wikipedia-sida som helst kan du klicka på sektionens namn och den går omedelbart ner till den sektionen.
WPBeginner Support
För det vill du använda ankarlänkar som vi täcker i vår artikel nedan:
https://www.wpbeginner.com/beginners-guide/how-to-easily-add-anchor-links-in-wordpress-step-by-step/
Admin
Gina
Hej,
Jag skapade kategorier och lade till dem i min meny så att när en läsare klickar kan de hitta alla blogginlägg i den kategorin. Mitt problem är att jag inte vill att blogg-namnet ska visas högst upp på sidan, det vill säga, "Blogging category" => "Blogging category description" => "blog posts", hur tar jag bort det?
WPBeginner Support
Det beror på ditt specifika temas stil. Om du kontaktar ditt temas support bör de kunna hjälpa till att ändra vad som visas
Admin
wan
jag försöker lägga till en menyartikel i min menystruktur. även när jag sparar menyn ändras inte webbplatsen. varför?
WPBeginner Support
Du bör se till att din webbplats eller din hostingleverantör inte har någon cache som kan orsaka ditt problem.
Admin
Keith
Bra resurser
WPBeginner Support
Thank you
Admin
Linda McMillan
Hej, jag använder Elementor och OceanWP. Jag har ställt in en anpassad länk i min meny så att när man klickar på den går man till startsidan. Hur kan jag få den att gå istället för att bara gå till startsidan, utan ner på sidan till en viss sektion? Jag uppskattar din hjälp.
WPBeginner Support
Du skulle vilja titta på att skapa en ankarlänk: https://www.wpbeginner.com/beginners-guide/how-to-easily-add-anchor-links-in-wordpress-step-by-step/
Admin
Annie
Navigeringen är i stort sett klar. En fråga dock, jag har en punkt i min navigering "produkter" därifrån delas det upp i 3 andra sektioner (en rullgardinsmeny dyker upp). Jag vill inte att besökare ska kunna komma åt den här produktsidan eftersom den kommer att vara tom, jag vill att de ska välja direkt från rullgardinsmenyn istället för att komma åt produktsidan först. Så produkter kommer fortfarande att visas i navigeringen men kommer att vara otillgängliga, besökare måste klicka på rullgardinsmenyn för att välja vad de letar efter. Hur gör jag detta? Om jag tar bort hela produktsektionen kommer den inte att visas i navigeringen längre, hur gör jag produktsidan otillgänglig?
WPBeginner Support
Du kan skapa en anpassad länk under Utseende>Menyer med titeln Produkter och länka den till antingen en annan sida eller # vilket bör hålla användarna på samma sida som de är på.
Admin
Ishan
Tack för din hjälp. Jag hade samma problem
Terry L. Cooper
Hur gammal är den här egentligen?? Jag ser inget av detta på WP-sidan.
WPBeginner Support
Stegen i den här artikeln bör fortfarande fungera för WordPress.org-webbplatser, är du på WordPress.com? https://www.wpbeginner.com/beginners-guide/self-hosted-wordpress-org-vs-free-wordpress-com-infograph/
Admin
Azizi
Ursäkta sir, vilken WordPress-mall använder du på WPbeginner.com?????
WPBeginner Support
We are using a theme we created for our site built on the Genesis Framework, for more on what we’re using on our site you would want to take a look at our blueprint page here: https://www.wpbeginner.com/blueprint/
Admin
Inzamam ul haq
Det hjälpte mig verkligen. mycket informativt. Tack
Natalie V
Hej! Tack så mycket för det här inlägget. Det hjälpte mig mycket. Jag har temat "Karuna". När jag lägger till fler menyalternativ (jag har 4) visas de i två rader. Jag skulle vilja ha dem alla i en rad. Finns det ett sätt att fixa det? Tack så mycket!
David
Behövde länka en köp nu-knapp till Woo Commerce kundvagnssida. Tillbringade två dagar i cirklar. Försökte kontakta Woo med liten framgång. Sedan hittade jag er som hjälpte till att lösa problemet.
Ofta är det de små sakerna som kan stoppa oss. Ett stort tack för den förenklade uppsättningen tydliga instruktioner.
Elliot Kershaw
Hej,
Jag skapar en webbplats med Ocean WP och Elementor, men jag kan inte se menyn högst upp på alla mina sidor. Den visas bara högst upp på startsidan. Så folk kan navigera till vilken sida som helst från startsidan, men om någon ville navigera tillbaka till startsidan eller till en annan sida därifrån, skulle det vara knepigt. Har du en lösning på detta? Tack!