I nogle tilfælde finder du måske et fantastisk tema og indser så, at det ville være fantastisk, hvis det havde en ekstra navigationsmenu med vigtige eller ofte anvendte links for at øge brugervenligheden af dit WordPress-websted.
Med blot en lille smule kodning kan du hurtigt få fundamentet for din nye menu oprettet og klar til at style den, så den passer til dit tema.
Hvis du hellere vil slippe for at rode med kode, er der mange plugins, der kan gøre det tunge arbejde for dig og også give dig stylingmuligheder.
Og uanset hvilken mulighed du vælger, vil guiden nedenfor hjælpe dig med at få det til at ske.
Grundlæggende husholdningsarbejde
For at oprette en ny menu skal du redigere dine temafiler. Før du foretager ændringer i nogen af dine kernefiler, er det bedst at tage en sikkerhedskopi af hele dit websted, hvis der skulle gå noget galt undervejs. Du vil hurtigt kunne gendanne dit websted, og det vil være som om intet nogensinde er sket.
Du kan manuelt sikkerhedskopiere dit websted via FTP eller ved hjælp af et plugin, som f.eks. vores eget Snapshot. Du skal blot sørge for at gemme en kopi af både din database og dine filer på et sted, der er adskilt fra dit websted, for at minimere risikoen for at miste din sikkerhedskopi.
Konstruktion af et undertema
For at oprette nye menuer med kode skal du foretage ændringer, der ville gå tabt, når du opdaterer dit tema. Oprettelse af et undertema tager sig af dette problem.
Du kan finde de detaljer, du har brug for for at oprette et undertema, ved at tjekke et par af vores andre indlæg Sådan opretter du et WordPress undertema og Sådan opretter du automatisk undertemaer i WordPress.
Du kan også vælge at oprette et helt nyt tema af dit eget eller prøve det på et lokalt eller testwebsted.
Du kan tjekke disse indlæg for at få flere oplysninger om, hvordan du opretter en lokal installation af WordPress:
- Sådan udvikler du WordPress lokalt med MAMP
- Sådan installerer du XAMPP og WordPress lokalt på PC/Windows
- Sådan opsætter du WordPress lokalt på 5 minutter med DesktopServer
- Den hurtige og nemme guide til at migrere en lokal WordPress-installation til et live-site
- Sådan flytter du WordPress til lokal udvikling med XAMPP
Når du har konfigureret en af disse muligheder, er du fri til at begynde at oprette dine ekstra navigationsmenuer. Selvom, hvis du beslutter dig for at bruge et plugin eller en temaramme, behøver du ikke at oprette et undertema.
Skabelse af nye menuer
For at tilføje en valgbar menuplaceringsmulighed i dit administratordashboard under Udseende > Menuer skal du gøre det, der kaldes “registrere en menu”. Det kræver blot, at du tilføjer en kodestump til din functions.php-fil, der ligger i wp-content > themes > your-theme.
I cPanel skal du klikke på ikonet Filhåndtering i afsnittet Filer på forsiden. Hvis du ikke tidligere har indstillet din Filhåndtering til at indlæse til webstedets dokumentrod, skal du navigere dertil nu.
Der er en functions.php-fil i din /wp-includes/-mappe, men det er ikke den, du skal redigere. Sørg for, at du finder filen functions.php, der findes i det tema, du bruger. Ellers vil du ende med fejl, når du forsøger at tilføje den kode, der findes senere.
Lokaliser din functions.php-fil, og klik på den én gang efterfulgt af at klikke på knappen Rediger øverst på siden.
Hvis en pop-up åbnes, skal du blot klikke på knappen Rediger nederst i højre side. Du ser muligvis ikke en, hvis du tidligere har deaktiveret den.
Rul til bunden af filen. Hvis du kun vil tilføje én menu, skal du tilføje følgende kode på en ny linje:
function register_my_menu() {register_nav_menu('new-menu',__( 'New Menu' ));}add_action( 'init', 'register_my_menu' );
I dette eksempel er New Menu det navn, der vil blive vist på din admin dashboardets menuside for at gøre det forståeligt for menneskeøjne. Navnet new-menu er det, som WordPress vil forstå for at udføre din kode korrekt.
Du kan kalde din menu, hvad du vil, men sørg for, at kun det menneskeligt læsbare navn indeholder mellemrum og store bogstaver.
Hvis du gerne vil tilføje flere menuer til dit websted, skal du i stedet tilføje denne kode på en ny linje:
Du kan tilføje lige så mange nye menuer, som du vil, med denne metode. Der gælder de samme regler for navngivning af dem.
Spar de ændringer, du har foretaget i filen. Nu er det eneste, der er tilbage, at tilføje den nye menu til dit websted.
Optagelse af menuplaceringer til dit tema
Det er her, du skal beslutte, hvor du vil placere din menu. Hvis du gerne vil have din menu til at blive vist øverst på din side, skal du redigere filen header.php. Du kan også placere den i din sidefod, hvilket betyder, at du skal redigere filen footer.php.
Du kan endda vise en menu på en side ved at redigere dens skabelonfil eller til en sidebar, ved at redigere dens fil sidebar.php.
Du kan placere din nye menu hvor som helst, du vil. Her er den minimale mængde kode, du skal tilføje til et af disse steder:
<?php wp_nav_menu( array( 'theme_location' => 'new-menu' ) ); ?>
Du skal blot erstatte new-menu med et WordPress-læsbart navn, som du har valgt. Du ønsker sandsynligvis at style din menu med CSS, så den går ud over den grundlæggende funktionalitet og også ser godt ud. For at gøre dette skal du oprette en klasse og tilføje den til dit tema med følgende kode:
<?php wp_nav_menu( array( 'theme_location' => 'new-menu', 'container_class' => 'new_menu_class' ) ); ?>
Nøjagtig som før skal du erstatte new-menu med det navn, du valgte. I dette eksempel navngav jeg den klasse, jeg oprettede, new_menu_class. Du kan ændre dette, men sørg blot for at opdatere denne kode, så den afspejler justeringen.
Klik på knappen Gem, og gå over til Udseende > Menuer i dit dashboard. Du vil bemærke, at dine nye menuer vil være opført under Temapositioner i afsnittet Menuindstillinger.
Du vil nu kunne se dine nye menupositioner opført. Når du tilføjer en menu, kan du vælge et eller alle stederne.
For at få vist links på dine nyligt oprettede menupunkter skal du klikke på Opret en ny menu øverst på siden.
Hvis du ikke allerede har en menu, kan du indtaste et navn til din menu i feltet på siden, hvorefter du klikker på Opret menu. Hvis du allerede har oprettet en menu tidligere, kan du klikke på linket Opret en ny menu mod toppen af siden.
Når du har oprettet en ny menu, kan du også administrere de steder, hvor de vises, under fanen “Administrer steder”.
Styling, plugins og responsive menuer
Din nye menu er nu klar til at blive stylet ved hjælp af CSS. Den nødvendige kodning er specifik for det tema, du bruger, så jeg vil ikke gå ind på det i dette indlæg, men vi har et andet indlæg, som du kan tjekke ud for det, der hedder Sådan opretter du en fantastisk responsiv menu til dit WordPress-tema. Det viser dig også, hvordan du opretter responsive menuer, der er mobilklare.
Hvis du gerne vil have en nemmere mulighed, er der mange plugins, der vil oprette responsive menuer baseret på dit temas stilarter. Et af de bedste, jeg har fundet, er Responsive Menu.
Nogle bemærkelsesværdige nævner, som du måske også finder nyttige, er ShiftNav, WP Responsive Menu og Max Mega Menu.
Ressourcer til at gå videre
Du har nu det solide grundlag, du har brug for til at oprette yderligere menuer til dit tema, og ressourcer, der kan hjælpe dig med at gå videre. Uanset om du selv koder den, bruger et plugin eller en temaramme, har du nu en ny menu på dit WordPress-websted.
Hvis du løber ind i problemer, så gå videre og spørg vores supporthelte. De kan give dig ekspertrådgivning og støtte til at hjælpe dig med at løse næsten alle problemer. Du kan åbne en billet i vores supportforum, så kommer vi straks og hjælper dig.
For flere oplysninger om, hvordan du styler dit nye tema, er der mange ressourcer, du kan tjekke ud, og du kan finde dem alle i vores indlæg En megaguide til at lære og referere CSS til WordPress:
Du kan også tjekke nogle af vores andre indlæg 10 enkle tips til at lære CSS til WordPress, 25 eksperttips til renere CSS-kodning til WordPress, 25 professionelle tips til forbedring af din CSS-arbejdsgang og 5 gratis CSS-plugins til live-redigering af dit WordPress-websted for at få flere oplysninger om kodning af CSS til dit tema.
Tags:
- menuer
- navigation