site navigation er nøglen til at hjælpe dine brugere med at komme, hvor de vil hen. En veldesignet menu kan gå langt i retning af at forbedre brugeroplevelsen og endda reducere din afvisningsprocent. En dårligt udformet kan dog gøre det modsatte.heldigvis kan du oprette brugerdefinerede menuer, der passer til behovene på din hjemmeside. Du kan endda bruge indbyggede funktioner til at tilføje en kompakt rullemenu, der sparer plads, mens du stadig giver klar retning for dine besøgende.

i dette indlæg vil vi diskutere, hvorfor hjemmeside navigation er vigtig, og hvordan rullemenuer kan være særligt nyttige. Derefter gennemgår vi, hvordan du opretter dem i , og deler nogle plugins, der kan hjælpe.

lad os dykke ind!

en introduktion til navigations-og rullemenuer

selvom de kan være beskedne, er navigationsmenuer et vigtigt element på enhver hjemmeside. De hjælper brugerne med hurtigt at finde de mest relevante sider til at nå deres mål, samtidig med at de giver førstegangsbesøgende en ide om, hvad du har at tilbyde:

at have en veldesignet navigationsmenu er nøglen til at øge konverteringer og mindske din afvisningsprocent. Når brugere nemt kan finde de sider, hvor dit produkt, din e-mail-tilmeldingsformular eller andet konverteringsindhold er placeret, har du det enklere at få dem til at foretage et køb eller tilmelde sig.

plus, hvis brugerne trygt kan finde vej i hele din hjemmeside, vil de ikke nødt til at hoppe fra dine sider, fordi de endte på det forkerte sted. At hjælpe dem med at få det rigtigt første gang kan både forbedre og minimere frustration.

i menuen er en iboende funktion. Ethvert sted oprettet med platformen kan vise en eller flere af dem. Temaer spiller dog også en vigtig rolle, når det kommer til styling og placering af din menu eller menuer.

af denne grund kan din menu antage mange forskellige former. Den mest kendte er standard header-menuen:

Du kan ofte også inkludere en ekstra footer menu nederst på dine sider. Det kan vise det samme indhold som din hovedmenu eller tilbyde lidt forskellige muligheder:

en anden stil er menuoverlejringen, som brugerne kan åbne og lukke efter ønske:

Alternativt kan du overveje at bruge en sidebar menu:

eller du kan indarbejde en rullemenu, også undertiden kaldet en “indlejret” menu:

denne type navigation er ideel til mange typer steder. Det vil ikke skjule dit indhold som en overlay-menu, men er ikke så påtrængende som en stor overskriftslinje eller en sidebjælke-menu.

Ved at skjule noget indhold, indtil det er nødvendigt, sparer du skærmplads, mens du stadig giver brugerne en nem måde at komme rundt på.

Sådan oprettes en rullemenu i ordtryk (i 5 trin)

Hvis du har besluttet, at en rullemenu muligvis passer godt til dit Ordtrykssted, er det ganske enkelt at indstille en. Du kan oprette et brugerdefineret navigationssystem, der passer til dine behov i kun fem trin.

Trin 1: Opret dine menupunkter

det første skridt mod at oprette en menu er at beslutte, hvad der skal medtages i den. Start med at navigere til udseende > menuer i dit ordtryksdashboard:

hvad du ser i menueditoren vil variere lidt afhængigt af dit tema.

det, der dog er vigtigt at bemærke for nu, er den første mulighed i fanen Rediger menuer. Du skal se en mulighed, hvor du kan vælge en af dine eksisterende menuer, der skal redigeres, samt en mulighed for at oprette en ny menu:

for dette eksempel, vi vælger sidstnævnte mulighed og opretter en ny menu. Dette indebærer at tilføje en titel og derefter klikke på knappen Opret Menu:

nu er du klar til at begynde at tilføje elementer til din Ordtryksmenu. I de fleste tilfælde er det bedst at holde din menu så enkel som muligt, mens du stadig giver brugerne nok information til at komme, hvor de vil hen.

inkorporering af for mange sider kan overvælde besøgende og gøre navigationen sværere i stedet for lettere.

der er et par forskellige måder at gå om at tilføje dine menupunkter. De to første er sider og indlæg, og de fungerer meget ens.

i sidebjælken i menueditoren skal du blot markere afkrydsningsfelterne for hver side eller post, du vil medtage, og klikke på knappen Tilføj til Menu:

din næste mulighed er at inkorporere brugerdefinerede Links. Dette indebærer at angive URL ‘ en til den side, du vil lede brugerne til, og derefter oprette en kort, men beskrivende etiket til den. Derefter kan du klikke på Tilføj til Menu igen:

endelig kan du også tilføje side-og postkategorier til din navigationsmenu. Dette fører brugerne til en arkivside, hvor de kan se alt indhold på et bestemt emne.

Blogs og andet indhold-tunge sider kan finde denne funktion særlig nyttig:

som med indstillingerne sider og indlæg skal du blot markere afkrydsningsfelterne for de kategorier, du vil medtage, og vælge Tilføj til Menu.

Trin 2: organiser din menu

når du har tilføjet alle dine menupunkter, skal du se dem opført i individuelle fliser under menustruktur i editoren:

oprindeligt vises menupunkter i den rækkefølge, du tilføjede dem. Du kan dog nemt ændre deres organisation ved at trække og slippe dem på plads. Dette giver dig mulighed for at oprette en simpel menu uden rullemenu.

der er et par måder at gå om at tilføje rullemenuer til din menu.

det enkleste er at fortsætte med at trække og slippe, men begynde at indlejre bestemte menupunkter under andre:

for eksempel i billedet ovenfor har vi flyttet de tre postkategorier, vi tilføjede til menuen under Blog, hvilket gør dem til “underelementer”. På frontend opretter dette en rullemenu, der ser sådan ud:

Hvis du vil tilføje en rullemenu, der indeholder alle kategorierne på din side, kan du gøre det ved at tilføje et brugerdefineret Link til din menu. Brug ” # “som URL og” kategorier”eller noget lignende til etiketten:

Du kan derefter tilføje alle dine kategorier til menuen og rede dem under denne etiket. Hver kategori kan klikkes, men etiketten vil ikke være:

ved hjælp af en lignende teknik kan du også skjule alle dine menupunkter i en enkelt rullemenu.

Tilføj et andet brugerdefineret Link ved hjælp af ” # “som URL og” Menu ” som etiket. Derefter, reden alle dine andre menupunkter under den ene:

resultatet på frontend vil være en rullemenu, der inkluderer dit steds nøglesider.

som du kan se i Kategorielementet nedenfor, vises ethvert indhold, der er indlejret under et underelement, i en undermenu:

Ved at bruge træk-og-slip-menueditoren på denne måde kan du oprette enhver stil og kombination af rullemenuer. Husk dog, at for mange menupunkter kan være forvirrende for brugerne.

det er også bedst at begrænse antallet af undermenuer, du inkorporerer, for at undgå at overfylde din navigation.

Trin 3: Indarbejd billeder i din menu

Hvis din rullemenu i slutningen af trin 2 ser nøjagtigt ud som du forestillede dig den, kan du springe til Trin 5 for at offentliggøre den. Der er dog yderligere trin, du måske vil tage, hvis du vil forbedre din menu med tilpasninger.

en taktik at overveje er at inkorporere visuelle elementer i dine menuer for at give yderligere vejledning til besøgende. Mens beskrivende etiketter er afgørende, kan et billede eller et ikon undertiden hjælpe brugerne hurtigere med at bestemme, hvor et bestemt navigationslink fører.

det er muligt at tilføje billeder ved hjælp af brugerdefineret CSS, som vi snart vil diskutere. Vi anbefaler dog at hente et plugin som Menubillede, ikoner gjort let:

på denne måde behøver du ikke bekymre dig om at generer nogen kode for at tilføje visuel interesse til din rullemenu.

Du skal blot installere plugin og derefter vende tilbage til udseende > menuer:

du vil se, at der nu er Billedindstillinger for hver side, du har inkluderet i din menu. Du kan vælge hver sides foto, størrelse og placering. Husk at gemme dine ændringer, når du er færdig.

Trin 4: Føj Brugerdefineret CSS til din rullemenu

selvom det ikke anbefales til begyndere, kan mellemliggende og avancerede brugere muligvis indarbejde deres egen styling i deres rullemenuer. Før du hopper lige ind i din CSS, skal du dog tilføje en klasse til din menu.

Hvis du springer dette trin over, kan din brugerdefinerede CSS forårsage problemer for andre menuer på din side. For eksempel kan du utilsigtet anvende styling til din sidefodsmenu, som du kun mente til din primære rullemenu.

i menueditoren skal du klikke på skærmindstillinger i øverste højre hjørne:

marker derefter afkrydsningsfeltet for CSS-klasser:

dette tilføjer et CSS-Klassefelt til hver side i din menu:

Når du har tilføjet en eller flere CSS-klasser til dine menupunkter, gælder enhver brugerdefineret kode, du Inkluderer på dit stilark, kun for elementerne i din menu med den klasse, du angiver.

Du kan nu gå over til dit stylesheet eller tilpasningen og komme i gang med din brugerdefinerede styling.

Trin 5: Udgiv din Menu i Prime steder

Når din rullemenu er struktureret til at opfylde dine behov, og du har indarbejdet eventuelle tilpasninger, du ønsker, vil du være klar til at udgive det til din hjemmeside.

denne proces varierer lidt afhængigt af dit tema og hvilke menuplaceringer det understøtter. I dette eksempel vil vi bruge det tyve tyve tema.

i menueditoren skal du rulle ned til menuindstillingsafsnittet:

Menuindstillingsafsnittet i editoren

Du kan markere det første afkrydsningsfelt, hvis du ønsker, at nye sider automatisk føjes til din menu. Hvis du lige er kommet i gang med din hjemmeside og ikke har tilføjet alle dine nøglesider endnu, kan dette være nyttigt. Vær dog forsigtig med, at du ikke ved et uheld tilføjer for mange elementer til din menu.

under denne indstilling vil du se en liste over afkrydsningsfelter, der angiver de forskellige områder på din hjemmeside, hvor du kan vise din menu.

det tyve tyve tema indeholder forskellige menuområder: Desktop vandret Menu, Desktop Udvidet Menu, mobil Menu, Sidefodsmenu, Social Menu.

i dette tilfælde er den menu, vi har oprettet, bedst egnet til skrivebordets vandrette Menuplacering, som er i sidens overskrift:

Du kan også overveje at navigere til fanen Administrer placeringer i vinduet menuer område af dit dashboard. Her kan du se alle de menuplaceringer, der understøttes af dit tema, samt hvilken menu du har tildelt hver enkelt:

Når du placerer dine menuer, kan det være nyttigt at se, hvordan de ser ud på frontend.

Klik på knappen Administrer med Live forhåndsvisning for at se, hvordan din menu vises på det sted, du har valgt til det, ved hjælp af:

Du kan derefter udgive din menu eller menuer direkte fra tilpasningen. Hvis du nogensinde har brug for at tilføje eller fjerne elementer fra din rullemenu, kan du blot vende tilbage til menueditoren og foretage de nødvendige justeringer.

Plugins til forbedring af dine rullemenuer

selvom du kan oprette fuldt fungerende navigationsmenuer uden ekstra værktøjer, kan det nogle gange være nyttigt at udvide menuens funktionalitet. Hvis det er tilfældet med din hjemmeside, kan du undersøge nogle populære plugins.indlejrede sider er en effektiv måde for indholdstunge blogs at oprette rullemenuer på. Selvom det primært bruges til at organisere indlæg og sider, genererer dette plugin også automatisk en menu, der afspejler dit indholds struktur:

selvom det ikke nødvendigvis er tilrådeligt at indarbejde et stort antal elementer i dine menuer, er det nogle gange uundgåeligt.hvis det er tilfældet med din hjemmeside, kan Mega Menu hjælpe dig med at kombinere dine eksisterende menuer til at danne en “mega menu”: