Att skapa en megameny pÄ webbplatser kan avsevÀrt förbÀttra navigeringsupplevelsen för besökarna. De kan enkelt utforska dina webbsidor för att hitta vad de vill ha.
Men standard WordPress-blockredigeraren (Gutenberg) kommer inte med nÄgon sÄdan funktion. SÄ om du har byggt din webbplats pÄ Gutenberg-editorn kan det vara svÄrt för dig att skapa en modern megameny för din WordPress-webbplats.
För att göra det enkelt för dig kommer vi att demonstrera steg-för-steg-processen för att skapa en megameny för WordPress i Gutenberg.
En megameny Àr en avancerad rullgardinsmeny som lÄter dig visa ett stort antal alternativ i en strukturerad layout med flera kolumner. Till skillnad frÄn traditionella rullgardinsmenyer som visar en enda lista med lÀnkar, kan en megameny visa flera kolumner och rader med lÀnkar, bilder och annat innehÄll.
Detta möjliggör ett mer organiserat och visuellt tilltalande sÀtt att presentera ett stort antal alternativ för anvÀndarna.
HÀr Àr nÄgra viktiga funktioner och fördelar med att anvÀnda en megameny i WordPress:
- FörbÀttrad navigering: Mega-menyer förbÀttrar webbplatsnavigeringen avsevÀrt med en avancerad layout, vilket gör det lÀttare för besökare att hitta det de letar efter utan att klicka för mycket.
- BÀttre anvÀndarupplevelse: Genom att visa mÄnga alternativ pÄ en gÄng pÄ ett organiserat sÀtt, minskar megamenyer den tid anvÀndarna spenderar pÄ att söka efter information, vilket ökar anvÀndarnas övergripande tillfredsstÀllelse.
- FörbÀttrad SEO: VÀlstrukturerade megamenyer kan ocksÄ ha en positiv inverkan pÄ SEO. Sökmotorer föredrar webbplatser med bra navigering, och en vÀlimplementerad megameny kan hjÀlpa sökmotorer att förstÄ din webbplatsstruktur bÀttre.
- Anpassningsbar och visuellt tilltalande: Mega-menyer Àr mycket anpassningsbara, sÄ att du kan anvÀnda bilder, ikoner eller vilket block som helst för att skapa visuellt tilltalande navigeringsmenyer som matchar din webbplatss varumÀrke och design.
- Responsiv design: Megamenyn Àr designad för att vara lyhörd, vilket sÀkerstÀller att menyn ser bra ut och fungerar bra pÄ alla enheter, inklusive mobiltelefoner och surfplattor.
Med Gutenbergs standardredigerare kommer du inte att kunna skapa en megameny. Gutenberg-blockredigeraren kommer bara med ett navigeringsblock som lÄter dig skapa en grundlÀggande navigeringsmeny.
SÄ du behöver ett WordPress-plugin som lÄter dig skapa en megameny i Gutenberg. För den hÀr handledningen kommer vi att anvÀnda GutenKit block editor plugin för att visa dig hur du skapar en megameny för WordPress i Gutenberg.
Med hjÀlp av GutenKit Mega Menu-funktionen kan du skapa multidimensionella WordPress-megamenyer med bÄde vertikala och horisontella rullgardinsmenyer.
Designa fantastiska menylayouter i undermenyer och rullgardinsmenyer med hjÀlp av behÄllare, karuseller, flikar och mer. Du kan ocksÄ förbÀttra webbupplevelsen med förbÀttrad navigering genom WordPress Mega Menu.
LÄt oss lÀra oss hur man skapar en WordPress megameny i Gutenberg.
Notera: Kom ihÄg att Mega Menu kommer som en premiumförlÀngning för GutenKit Nav-menyblocket. För att anvÀnda dess funktioner, se till att Nav-menyn Àr aktiverad.
NÀr du har installerat plugin-programmen GutenKit och GutenKit Pro pÄ din WordPress-webbplats, gÄ till GutenKit > Blockera frÄn din instrumentpanel. Vrid sedan pÄ vÀxlingsknappen för Nav-meny blockera för att aktivera det.
Efter det, i blockredigeraren, vÀlj Nav Menu-blocket. LÀgg sedan till menyalternativ till den. För GutenKit Nav-menyalternativen kan du lÀgga till din webbplatss befintliga sida. HÀr Àr hur man skapar en navigeringsmeny med GutenKit.
Det som Àr unikt med GutenKit Àr ocksÄ att du kan lÀgga till nya sidor till menyalternativen i Nav och dessa sidor kommer att skapas pÄ din webbplats som en utkastsida.
Nu kommer huvuddelen av att skapa WordPress megameny i Gutenberg.
NÀr du vÀljer ett Nav-menyalternativ ser du ett alternativ att aktivera Undermeny. Om du aktiverar det alternativet fÄr du vÀlja undermenytyp till rullgardinsmeny eller megameny. SjÀlvklart kommer du att vÀlja Mega meny I detta fall.
Alternativt kan du aktivera megamenyn som en undermeny genom att klicka pÄ knappen "LÀgg till megameny" i blockverktygsfÀltet.
Med GutenKit Mega Menu-blocket kan du lÀgga till vilket block som helst som ett menyalternativ i megamenyn. Designa din meny med bilder, kartor, dragspel, formulÀr, pristabeller eller nÄgra Gutenberg-block i undermenyn.
HĂ€r har vi lagt till Flip Box som ett menyalternativ i Mega-menyn.
Nu kan du anpassa utseendet pÄ WordPress mega-menyn med GutenKit. Du kan skrÀddarsy menyns bredd och menyposition.
VÀlj menybredd till följande:
- Full bredd
- I kö
- BestÀllnings
För anpassad bredd kan du justera menybredden manuellt.
Sedan kan du stÀlla in positionen för att justera menyn till vÀnster eller justera till höger.
Megamenyerna du designar med GutenKit Àr pixelperfekta för alla enheter. Du kan designa en mobil responsiv meny med dedikerade Mobile Menu Settings, dÀr du kan infoga en logotyp, lÀgga till anpassade lÀnkar till den och vÀlja en menylogotyp för mobilen.
För mobilmenyn kan du anpassa ikonstorlek, bredd, fÀrg och varje enskild detalj av Hamburgerikonen och logotypen.
Grattis! Du har designat en vacker WordPress megameny i Gutenberg som tar din webbplatss anvÀndarupplevelse och estetik till nya höjder, oavsett om den Àr pÄ mobil, stationÀr eller vilken annan enhet som helst.
Avslutar
I den hÀr bloggen har vi visat dig det enklaste sÀttet att skapa horisontella och vertikala menyer i WordPress-blockredigeraren. Hoppas detta hjÀlper dig att skapa megamenyn i Gutenberg mest effektivt. Kom ihÄg att en vÀlstrukturerad meny kan pÄverka anvÀndarnas engagemang och tillfredsstÀllelse avsevÀrt.
I likhet med den omfattande funktionaliteten i Mega Menu-blocket, har GutenKit en uppsjö av avancerade funktioner som Àr skrÀddarsydda specifikt för blockredigeraren, som sömlöst integrerar kraftfulla sidbyggande funktioner i din Gutenberg-drivna webbplats.
Med GutenKit kan du lÄsa upp mÄnga verktyg och alternativ för att lyfta din webbplats design och funktionalitet till nya höjder inom den intuitiva Gutenberg-miljön.
LĂ€mna ett svar