Så här lägger du till villkorlig logik i menyer i WordPress (steg för steg)

Ibland vill du kanske att olika menu-items ska visas på olika pages i WordPress. Eller så kanske du vill ha en speciell meny bara för inloggade användare.

Som standard visar WordPress samma menu överallt i your theme. Detta tillvägagångssätt som passar all är inte alltid idealiskt.

I den här artikeln guidar vi dig till hur du lägger till villkorlig logik i dina menyer. På så sätt kan du customize vad besökarna ser baserat på specifika villkor.

Varför addera villkorlig logik till menyer i WordPress?

Navigationsmenyer ger din WordPress-webbplats struktur och hjälper besökarna att hitta det de letar efter. Som standard visar din WordPress-webbplats samma navigeringsmeny för alla användare och på alla inlägg och sidor.

Det kan dock finnas tillfällen då du vill displayed olika menyer för olika användare eller på olika pages på your website.

Websites som gillar en online store, en WordPress membership site community eller en online utbildningsplattform kan alla dra nytta av personliga navigation menyer.

Med hjälp av villkorlig logik kan du lägga till extra menu items för inloggade användare så att de kan hantera sina konton, förnya sina prenumerationer eller view de onlinekurser de köpt. Tänk på det som WordPress personuppgiftsansvarig för menyåtkomst.

Med detta i åtanke kommer vi att visa dig hur du lägger till villkorlig logik i WordPress-menyer. Här är de ämnen vi kommer att täcka i denna handledning:

Är du redo? Låt oss sätta igång.

Skapa nya navigationsmenyer i WordPress

Det första steget är att skapa de ytterligare menyer för navigation som du vill visa i WordPress. Därefter kan du använda villkorlig logik för att bestämma när varje meny ska visas.

Hädanefter kommer vi att visa dig hur du lägger till villkorliga menyer i WordPress för både klassiska och blockredigerare.

Skapa nya navigeringsmenyer i WordPress med hjälp av den klassiska redigeraren

Den här metoden fungerar för användare av klassiska teman.

Du skapar nya navigeringsmenyer genom att gå till sidan Utseende ” Menyer i WordPress instrumentpanel. Om du redan har en navigeringsmeny som du använder på din webbplats för alla användare, kan den vara din standardmeny.

Därefter måste du klicka på länken ”Skapa en ny meny” för att skapa ett nytt menyalternativ. Du kan t.ex. skapa en meny som ska visas för inloggade användare och en annan som ska visas på en viss WordPress-sida eller kategori.

På vänster sida av vyn kan du se en lista över dina pages på din website. Du kontrollerar bara boxen bredvid den page du vill add to din menu och clickar på knappen ”Add to Menu”.

Du kan också dra and drop meny-items på höger sida av vyn för att ordna om dem.

Längre ner på sidan kan du välja en location för att visa din menu. Men du behöver inte tilldela en location till den här menyn nu. Det gör vi i nästa steg.

Glöm inte att klicka på knappen ”Save Menu” för att spara dina ändringar.

För mer detaljer om hur du skapar menyer kan du ta en titt på vår guide för nybörjare om hur du lägger till en navigation menu i WordPress.

Skapa nya navigeringsmenyer i WordPress med hjälp av FSE

För att skapa nya navigeringsmenyer i ett blocktema med Full Site Editing (FSE) måste du först navigera till Utseende ” Editor från din WordPress-panel.

När du väl är inne kan du klicka på fliken ”Navigation” för att expandera den. Om du undrar använder vi temat Twenty-Twenty Three för den här guiden.

Därefter klickar vi på ”Redigera” bredvid etiketten ”Navigering”. Detta öppnar hela webbplatsredigeraren på din skärm.

Därefter är det bara att klicka på ikonen ”+” för att lägga till ett navigeringsmenyalternativ. Du kommer då att se en prompt som visar en rullgardinsmeny där du kan välja ett alternativ.

För mer detaljerade instruktioner kan du läsa vår guide om hur du lägger till en navigeringsmeny i WordPress.

Visa en annan meny för inloggade användare i WordPress

Det är ofta användbart att visa olika menyer för navigation för användare beroende på om de har loggat in på din site eller ej.

Du kan till exempel inkludera log in och registreringslänkar för utloggade användare och add to en länk till logga ut i din menu för inloggade användare.

Om du run en WooCommerce store, då kan du inkludera objekt för dina kunder som är dolda från allmänheten.

Visa en annan meny för inloggade användare som använder Classic Editor

För att komma igång måste du installera och aktivera pluginet Conditional Menus. För mer detaljer, se vår Step-by-Step guide om hur du installerar ett WordPress plugin.

Efter aktivering ska du navigera till Appearance ” Menus och växla till fliken ’Manage Locations’.

From here, you will see the list of available menu locations and the menus that are currently displayed. Dessa varierar beroende på vilket WordPress theme du använder.

Till exempel, på vår demo website, visar det att vår ”Primary Menu” location visar en navigation menu med titeln ”Main Menu”.

Vi kan säga till pluginet att visa en annan meny när ett visst villkor matchas genom att clicka på länken ”+ Conditional Menu” och välja en annan meny från rullgardinsmenyn.

I den här handledningen väljer vi ”Inloggad meny”.

Därefter måste du klicka på länken ”+ Villkor”.

Detta kommer att visa en popup där du ser ett antal villkor att välja mellan.

Kontrollera bara boxen bredvid alternativet ”User logged in” och klicka sedan på knappen ”Save”.

You can now visit your website to see the logged-in user menu in action. Du kan logga ut från din website för att se den navigation menu som visas för alla andra användare.

För mer detaljerade instruktioner och för att lära dig hur du gör detta med kod, ta en titt på vår guide om hur du visar olika menyer för inloggade användare i WordPress.

Visa en annan meny för inloggade användare som använder FSE

Om du använder ett blocktema behöver du pluginet Conditional Blocks. Så låt oss installera och aktivera pluginet först. Om du behöver hjälp kan du läsa vår guide om hur du installerar ett WordPress-plugin.

När du har aktiverat den kan du öppna FSE-funktionen genom att navigera till Utseende ” Redaktör. Sedan klickar du på ”Mönster” och sedan på ”Alla malldelar”.

Du bör nu se alla dina malldelar, som kan innehålla en sidfot, rubrik och kommentarer. Vi klickar på de tre prickarna i avsnittet ”Rubrik” och väljer sedan ”Redigera”.

Du kommer då att omdirigeras till blockredigeraren.

Nu måste du klicka på den navigeringsmeny som du vill lägga till villkor för. Därefter byter du helt enkelt till fliken ”Block” på den högra sidopanelen för att börja anpassa.

Om du bläddrar ner på fliken ”Block” ser du avsnittet ”Villkorliga block”. Klicka bara på det för att öppna anpassningsalternativen.

Gå sedan vidare och klicka på knappen ”Redigera synlighet”.

Ett popup-fönster där du kan ställa in villkor för den valda navigeringsmenyn visas.

Här kan du öppna rullgardinsmenyn ”CONDITION” och välja alternativet ”User Logged In”.

Stäng bara fönstret genom att klicka på ”X”-knappen i det övre högra hörnet.

Du bör då se att ett villkor har lagts till i avsnittet ”Villkorliga block”. Gå vidare och klicka på ”Spara” för att uppdatera dina navigeringsmenyer.

Om du nu besöker din webbplats kan det se ut så här för inloggade och utloggade användare:

Visa en annan WordPress-meny beroende på användarens roll

När en användare har loggat in kan du också visa en annan navigation menu beroende på vilken roll du har tilldelat användaren.

Du kan t.ex. inkludera extra menu items för en administratör och mer limiterade items för en contributor. På en membership site kan du ge olika nivåer av åtkomst till olika medlemsnivåer.

Visa en annan WordPress-meny beroende på användarroll med hjälp av den klassiska redigeraren

Som i föregående avsnitt måste du installera och aktivera plugin-programmet Conditional Menus.

Sedan kan du gå till sidan Utseende ” Menyer och växla till fliken ” Hantera platser ”.

You should add to the appropriate conditional menu for your selected user role. I den här tutorialen väljer vi menyn ”Nav Menu Administrator”.

Efter det kan du clicka på länken ”+ Villkor” för att välja roll för användaren.

You will need to click on the ’User Roles’ tab to see checkboxes for each user role on your website. Klicka på de användarroller som ska se den här menyn och klicka sedan på knappen ”Save” för att spara dina ändringar.

Visa en annan WordPress-meny beroende på användarroll med hjälp av FSE

För att visa en annan meny beroende på användarroller i FSE använder du insticksprogrammet Content Control. Om du behöver hjälp med att installera och aktivera det kan du läsa vår guide om hur du installerar ett WordPress-plugin.

Efter aktivering kan du navigera till Utseende ” Redaktör ” Mönster ” Alla malldelar. Klicka sedan på de tre prickarna i avsnittet ”Header” och välj sedan ”Edit”.

I redigeraren kan du välja en navigeringsmeny som du vill lägga till villkor för.

Till exempel ska vi göra vår ”Blogg”-sida exklusiv för våra prenumeranter. Så vi klickar på ”Blogg” för att öppna dess anpassningsalternativ.

Härifrån går vi över till den högra panelen och växlar reglaget ”Aktivera kontroller” i avsnittet ”Blockera kontroller”.

Sedan ska du bläddra ner till avsnittet ”Användarregler” för att ställa in villkoren.

Först öppnar du rullgardinsmenyn ”Vem kan se det här innehållet” och väljer ”Inloggad användare”.

Sedan kan du välja ”Matchning” för rullgardinsmenyn ”ANVÄNDARROLL”. Och i ”CHOSEN ROLES”, låt oss välja ”subscriber”.

När du är klar kan du fortsätta och klicka på knappen ”Spara”.

Visa olika menyer för olika pages i WordPress

I WordPress kan du visa olika menyer för olika pages. Du kan t.ex. visa extra menu items på din page med integritetspolicy, t.ex. en länk till din cookie notice.

Visa en annan meny för olika sidor i WordPress med hjälp av den klassiska redigeraren

För att göra detta måste du installera och aktivera tillägget Conditional Menus. Sedan vill du navigera till Appearance ” Menus ” Manage Locations.

När du har valt rätt navigation menu kan du klicka på länken ”+ Conditions”. Den här gången ska du klicka på tabben ”Pages”. You will see a list of every page on your website.

Du måste sedan placera en bockmarkering bredvid varje page där du vill visa navigation menu. När du är klar klickar du på knappen ”Save”.

Visa en annan meny för olika sidor i WordPress med hjälp av FSE

Användare av temat Block kan använda tillägget Block Visibility. Om du behöver hjälp med installationen kan du läsa vår guide om hur du installerar ett WordPress-tillägg.

När den är aktiverad navigerar vi till Utseende ” Redaktör ” Mönster ” Alla malldelar. Och när du har öppnat Header-redigeraren kan du gå till avsnittet ”Synlighet”.

Härifrån kan du öppna rullgardinsmenyn och välja ”URL Path”.

Sedan kan du lägga till URL-sökvägen till sidan med sekretesspolicyn i området ”URL PATH (CONTAIN)”.

En URL-sökväg är den del av en webbadress som kommer efter webbplatsens huvudnamn och som visar en viss sida eller ett visst objekt.

I adressen https://example.com/about är till exempel /about-delen URL-sökvägen.

Om du inte vet vilken URL-sökväg som finns till sidan med sekretesspolicyn kan du gå till Sidor ” Alla sidor. Sedan vill du hitta sidan Sekretesspolicy och hålla muspekaren över den.

Klicka bara på knappen ”Quick Edit” och du kommer att vilja se avsnittet ”Slug”. URL-sökvägen bör vara symbolen ”/” följt av sidans slug.

Eller så besöker du bara sidan och kopierar och klistrar in biten efter domännamnet.

Nu är det klart! Gå vidare och klicka på ”Spara” för att lagra ändringarna.

Dölja navigationsmenyn på landing pages i WordPress

Det kan finnas sidor på din website där du inte vill displayed a navigation menu at all, such as your landing pages.

En landing page är utformad för att öka försäljningen eller generera leads för ett företag. På dessa pages vill du minimalisera distraktioner och ge användarna all information de behöver för att vidta en specifik action.

I vår guide om hur du ökar konverteringen av din landing page med 300% föreslår vi att du minimaliserar distraktioner genom att ta bort navigationsmenyer och andra links från sidan.

Dölja navigeringsmenyn på landningssidor i WordPress med hjälp av den klassiska redigeraren

Du kan göra det med hjälp av tillägget Conditional Menus. Den här gången väljer du ”Inaktivera meny” från dropdown när du väljer den villkorliga menyn.

Därefter klickar vi på länken ”+ Conditions” för att välja när menyn ska visas.

Du bör klicka på fliken ”Sidor” och placera en bockmarkering bredvid objektet ”Min landningssida”.

Glöm inte att klicka på knappen ”Save” för att lagra och tillämpa your settings.

Dölja navigeringsmenyn på landningssidor i WordPress med hjälp av FSE

För användare av blockteman kan du nu använda pluginet Block Visibility, men den här gången anger du URL-sökvägen i fältet ”URL Path (Does Not Contain)”.

Nu ska vi installera och aktivera insticksprogrammet. Om du behöver hjälp är du välkommen att läsa vår guide om hur du installerar ett WordPress-plugin.

Efter aktivering kan du gå till Utseende ” Redaktör ” Mönster ” Alla malldelar. Väl inne i Header-redigeraren, låt oss hitta avsnittet ”Synlighet”.

Härifrån kan du välja ”URL Path” och ange sökvägen till din målsida i fältet ”URL Path (Does Not Contain)”.

När du är klar klickar du bara på knappen ”Spara”.

Gör mer med menyer för navigation i WordPress

Navigation menus är kraftfulla tools för webbdesign. They allow you to direct users to the most important sections of your website.

Nu när du visar olika navigationsmenyer på olika pages och för olika användare kanske du undrar hur du kan customize dem ytterligare.

För att förbättra funktionaliteten i dina navigations menyer, kanske du vill kontrollera dessa tutorials. De hjälper dig att ta din WordPress site till nästa nivå:

• Så här addar du customize objekt till specifika menyer i WordPress
• Så här addar du customize navigeringsmenyer i WordPress themes
• Så här add to en fullskärms responsiv menu i WordPress
• Så här skapar du en vertikal navigation menu i WordPress
• Så här addar du en mega menu till din site i WordPress
• Så här utformar du menyer för navigation i WordPress

Vi hoppas att denna tutorial hjälpte dig att lära dig hur du lägger till villkorlig logik i menyer i WordPress. Härnäst kanske du vill lära dig hur du add to rubriker i WordPress-menyn utan att länka till en page eller hur du visar breadcrumb navigation-länkar i WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.