Hur man skapar vertikal meny i WordPress

Vill du ge din webbplats en modernare touch?
Tja, att ersätta en traditionell horisontell meny med en vertikal kan omedelbart ge din WordPress-webbplats ett elegant och modernt utseende. Utöver det kan en vertikal meny förbättra användarupplevelsen också.

Men hur skapar man en vertikal meny i WordPress?

Tja, det finns flera sätt du kan lägga till en vertikal meny till din WordPress-webbplats.

I den här bloggen kommer vi att visa dig hur man gör vertikal meny i WordPress och du kan också skapa en vertikal megameny.

Vad är Vertical Menu i WordPress?

En vertikal meny i WordPress representerar en samling av länkar ordnade i vertikal ordning snarare än den traditionella horisontella. Nuförtiden har den här typen av vertikala WordPress-menyer nyligen blivit extremt populär då den är mer användarvänlig, speciellt på mobila enheter. 

Fördelar med att använda en vertikal meny på en WordPress-webbplats:

• Dessa menyer är visuellt snyggare 
• Lätt att navigera meny
• Upprätthålla lyhördhet av webbplatsen på mobila enheter
• Du kan lägga till fler menyer på toppnivå i den vertikala menyn än horisontell
• Fungerar utmärkt på e-handelswebbplatser

Hur man skapar vertikal meny i WordPress med Elementor och ElementsKit 

Här är steg-för-steg-guiden om hur man gör vertikal meny i WordPress. Du behöver en sidbyggare- Elementor och vertikal meny WordPress plugin – ElementsKit. Du kan enkelt skapa WordPress vertikal meny om du följer stegen nedan:

Steg 1: Installera Elementor och ElementsKit  

 För att installera, logga in på din instrumentpanel och

• Navigera till : Plugins ⇒ Lägg till ny
• Sök efter Elementor / ElementsKit (ett i taget)
• Klicka på Installera nu

Efter installationen klickar du på knappen Aktivera för att aktivera.

Steg 2: Skapa en meny för din vertikala WordPress-meny

Låt oss nu skapa en meny. För detta, navigera till Utseende ⇒ Meny. 

När du är på menysidan måste du

1. Klicka på Skapa en ny meny
2. Ange ett namn under Menynamn alternativ
3. Klicka slutligen på Skapa meny för att skapa menyn.

Nu behöver du:

1. Välj menyn från rullgardinsmenyn
2. Klicka på Välj
3. Klicka på kryssrutan för menyn du vill lägga till
4. Klicka på Lägg till i menyn för att lägga till den meny du väljer
5. Till sist, klicka på Spara-menyn för att uppdatera

Om du har en meny på flera nivåer kan du ändra ordning på menyalternativen och klicka på Spara-menyn att uppdatera.

Steg 3: Aktivera vertikal menywidget för ElementsKit

Navigera till ElementsKit ⇒ WIDGETS ⇒ Vertikal menywidget, slå på widgeten och klicka på Spara ändringar.

Steg 4: Dra och släpp widgeten

Redigera sidan med alternativet Redigera med Elementor. Sedan Sök för widgeten Stylist List med Ekit-ikonen och helt enkelt dra och släpp widgeten på sidan.

Steg 5: Anpassa vertikala menyinställningar

Nu är det dags att lägga till menyn du just skapat eller den du föredrog till din vertikala meny. Du kan göra det från rullgardinsmenyn Välj meny.

Om du vill förvandla din vertikala Elementor-meny till en hopfällbar knapp, måste du slå på växlingsknappen. När du slår på kan du ändra titeln på växlingsknappen och kan även välja att lägga till ikoner på både vänster och höger sida.

Aktivera alternativet Aktivera svävare och aktivera växeln vid svävning (som standard fungerar det vid klick.)

Steg 6: Anpassa stil på vertikal meny

Nu är det dags att ändra stilen på din vertikala meny. För att flytta till stilfliken.

Expandera menybehållaren för att ändra bakgrundstyp, färg, plats, andra färg, boxskugga, kantradie och så vidare.

På samma sätt kan du ändra många stilalternativ under menyalternativ och undermenyalternativ.

När du är klar med all anpassning, klicka på publicera och se förhandsvisningen:

Hur man skapar en vertikal megameny i WordPress med Elementor och ElementsKit 

För att följa den här handledningen måste du se till att den vertikala menywidgeten du aktiverade tidigare fortfarande är påslagen.

Steg 1: Slå på nödvändiga ElementsKit-moduler 

Navigera till ElementsKit ⇒ Moduler, aktivera både Mega Menu och Header Footer Builder, och slutligen klicka på Spara ändringar för att uppdatera.

Se nu till att du skapar en meny för din vertikala meny genom att följa steg som visas ovan. 

Steg 2: Aktivera ElementsKit Megamenu-alternativet 

När du är klar med att förbereda din meny, kolla ElementsKit Megamenu alternativet för att aktivera megamenyfunktionen. När du väl har markerat det här alternativet kommer du att se megamenyalternativet om du håller muspekaren över menyn.

Steg 3: Konvertera meny till megameny med ElementsKit 

För att nu konvertera en enkel meny till en megameny, håll muspekaren över menyn och klicka på megamenyalternativet. Sedan slå på Mega-menyväxlingsknappen end klicka på Redigera Mega Menu Innehåll. 

Klicka nu på Ekit-ikonen, flytta till avsnittsfliken, sök efter megamenyn och välj sedan den förgjorda megamenymallen du gillar. När du väl har infogat den kan du redigera den efter dina behov.

När du är klar klickar du på uppdatera för att spara menyn. Upprepa samma process på alla menyer som du vill skapa en megameny för. 

Och det är det du har gjort din megameny. Du kan använda ElementsKit sidfotsbyggaren för att lägga till en megameny på din webbplats. 

För mer information om megamenybyggaren av ElementsKit, kolla vår blogg Hur man bygger en megameny med Elementor och ElementsKit. Du kan också se hela processen i videon nedan:

Slutord

ElementsKit gör att skapa en vertikal meny i WordPress till en extremt enkel uppgift att utföra. Även om en horisontell meny är bra, kan ibland en förändring i menyn lyfta utseendet på din webbplats. Speciellt om du har en e-handelssida bör du prova megamenyfunktionen i ElementsKit.

Jag hoppas att du tyckte att bloggen var användbar, om du har några frågor angående WordPress-plugin för vertikala menyer får du gärna meddela oss.