Så här addar du en meny med slides panel i WordPress Themes

Genom att lägga till en slidepanelmeny på din WordPress-webbplats kan du förbättra navigeringen, särskilt på mobila enheter. Den här funktionen ger en jämn och vacker animering när användarna trycker på menyikonen.

En responsiv meny gör det lättare för besökare att utforska din webbplats på sina telefoner eller surfplattor. Det säkerställer en sömlös surfupplevelse och håller din publik engagerad.

I den här artikeln guidar vi dig genom hur du lägger till en slidepanelmeny i ditt WordPress-tema. Det bästa av allt är att du kan göra detta utan att skriva någon kod.

Varför lägga till en Slide Panel-meny i WordPress-teman?

Väldesignade menyer hjälper dina besökare att hitta runt på din WordPress-webbplats. Många av dina besökare kommer att använda mobila enheter, så det är viktigt att förhandsgranska mobilversionen av din WordPress-webbplats för att se hur din navigeringsmeny ser ut på mindre skärmar.

Som tur är har många WordPress-teman inbyggda stilar som automatiskt visar mobilvänliga menyer när de visas på en liten skärm.

Men du kanske vill customize din mobila navigation ännu mer och add to en fullscreen responsive menu eller animerad slide panel menu.

Med detta i åtanke, låt oss ta en titt på hur man add to en slides panel menu i WordPress themes.

Så här lägger du till en Slide Panel-meny i WordPress-teman

Det första du behöver göra är att installera och aktivera insticksprogrammet Responsive Menu. Om du behöver mer information kan du läsa vår steg-för-steg-guide om hur du installerar ett WordPress-plugin.

Det finns en premiumversion av Responsive Menu-pluginet med extra teman och ytterligare funktioner som villkorlig logik. Men för denna handledning kommer vi att använda det kostnadsfria pluginet.

Efter aktivering navigerar vi till Responsive Menu ” Menyer från din WordPress-panel. Väl där ska du klicka på knappen ”Skapa ny meny” längst upp på skärmen.

Du kommer sedan att se 4 teman som du kan använda för din nya responsiva meny. Ytterligare teman finns att köpa.

I den här tutorialen använder vi det automatiskt valda temat. Du kan sedan klicka på knappen ”Nästa”.

Du kommer då till sidan ”Menu Settings”.

Här kan du ange ett namn på din responsiva meny och sedan välja vilken WordPress-meny du vill ska visas i panelen. Vi har t.ex. valt menyn ”Navigation”.

Om du behöver skapa en ny meny kan du lära dig hur du gör det genom att följa vår guide om hur du lägger till en navigeringsmeny i WordPress.

Du kan också dölja den vanliga menyn som följer med ditt WordPress theme så att dina användare bara ser den nya menyn med slides panel. Du gör detta genom att enter CSS-kod i fältet ”Hide Theme Menu”.

Koden som du måste enter här varierar från tema till tema, och du kan få mer details genom att clicka på länken ”Learn More”.

När du är nöjd med settings ska du klicka på knappen ”Create Menu” längst ner på sidan. Detta kommer att ta dig till en page där du kan slutför customize din menu.

Du kommer att se en förhandsgranskning av din webbplats till höger på skärmen och det finns knappar längst ner för att växla mellan telefon-, surfplatta- och skrivbordsvyer. Du hittar också anpassningsalternativ till vänster.

Du kanske märker att det visas lite text ovanför menyn. Det är menyns titel och en textrad som insticksprogrammet kallar ”extra innehåll”.

Du kan editera eller dölja texten genom att clicka på ”Mobile Menu” och sedan ”Container” i menyn till vänster på page.

Dessutom kan du skriva in vad du vill i fältet ”Title Text”, t.ex. ”Main Menu” eller ”Navigation”. Om du inte vill visa en titel är det bara att skjuta reglaget ”Title” till off-läget.

Efter det ska du bläddra ner till inställningen ”Ytterligare innehåll”.

Härifrån kan du stänga av den här inställningen eller skriva in alternativt innehåll. I skärmdumpen nedan ser du att strömbrytaren har stängts av, så orden ”Lägg till mer innehåll här…” är nu dolda.

När du är nöjd med menyinställningarna ska du klicka på knappen ”Uppdatera” längst ned på sidan för att spara dina inställningar.

Responsive Menu-pluginet erbjuder många andra alternativ för att ändra beteendet och utseendet på din slidepanelmeny. Du kan utforska dessa alternativ på plugin-programmets inställningssida och justera dem efter behov.

Nu kan du besöka din webbplats för att se menyn i aktion. Så här ser det ut på vår demowebbplats. Observera att om den aktuella sidan finns i menyn är den markerad med ett färgband.

Vi hoppas att denna handledning hjälpte dig att lära dig hur du lägger till en slidepanelmeny i WordPress-teman. Du kanske också vill lära dig hur du skapar en rullgardinsmeny och hur du visar olika menyer för inloggade användare 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.