Hur man lägger till fler navigeringsmenyer till ditt WordPress-tema
Med bara lite kodning kan du få grunden för din nya meny inställd snabbt och redo för dig att anpassa för att passa ditt tema.
Om du hellre inte vill bråka med koden finns det massor av plugins där ute som kan göra det tunga lyftet åt dig, och även ge stylingalternativ.
Vilket alternativ du än väljer hjälper guiden nedan dig att uppnå det.
Så här lägger du till menyer till ditt WordPress-tema:
- Bygg ett barntema
- Skapande av nya menyer
- Lägg till menyplatser till ditt tema
- Stil din navigeringsmeny
Grundstädning
För att skapa en ny meny måste du redigera dina temafiler. Innan du gör några ändringar i någon av dina kärnfiler är det bäst att säkerhetskopiera hela din webbplats ifall något går fel på vägen. Du kommer att kunna återställa din webbplats snabbt och det kommer att vara som om ingenting hade hänt.
Du kan manuellt säkerhetskopiera din webbplats via FTP eller med hjälp av ett plugin, till exempel vår egen Snapshot. Se bara till att spara en kopia av din databas och filer på en separat plats på din webbplats för att minimera risken att förlora din säkerhetskopia.
Bygg ett barntema
För att skapa nya menyer med kod måste du göra ändringar som skulle gå förlorade när du uppdaterar ditt tema. Att skapa ett barntema löser detta problem.
Du kan hitta informationen du behöver för att skapa ett barntema genom att kolla in några av våra andra artiklar Hur man skapar ett WordPress-barntema och hur man skapar barntema automatiskt i WordPress.
Du kan också välja att skapa ditt eget tema eller prova det på en lokal eller testsajt.
Du kan kolla in dessa artiklar för mer information om hur du skapar en lokal installation av WordPress:
När du har konfigurerat något av dessa alternativ är du fri att börja skapa dina ytterligare navigeringsmenyer. Men om du bestämmer dig för att använda ett temaplugin eller ramverk behöver du inte skapa ett underordnat tema.
För att lägga till ett valbart menyplatsalternativ i din administratörspanel under Utseende> Menyer du måste göra vad som kallas "spela in en meny". Lägg bara till ett kodavsnitt till din fonctions.php fil som finns i wp-content > teman > ditt tema.
I cPanel klickar du på fILHANTERAREN ikonen i Filer avsnitt på hemsidan. Om du ännu inte har definierat din fILHANTERAREN Navigera dit nu för att läsa in dokumentroten på din webbplats.
Det finns en fonctions.php fil i din /wp-inkluderar/ mapp, men det är inte den du behöver redigera. Se till att hitta fonctions.php fil som finns i det tema du använder. Annars skulle du få fel när du försöker lägga till den hittade koden senare.
Hitta din fonctions.php filen och klicka på den en gång följt av att klicka på Redigera knappen högst upp på sidan.
Om ett popup-fönster öppnas klickar du bara på Redigera nedre högra knappen. Du kanske inte ser en om du tidigare inaktiverat den.
Rulla ner filen. Om du bara vill lägga till en meny, lägg till följande kod på en ny rad:
function register_my_menu() { register_nav_menu('new-menu',__( 'New Menu' )); } add_action( 'init', 'register_my_menu' );
I detta exempel, New Menu
är namnet som kommer att visas på din administratörsinstrumentpanels menysida för att göra det begripligt för mänskliga ögon. de new-menu
namn är vad WordPress förstår för att köra din kod korrekt.
Du kan kalla din meny vad du vill, men se till att endast det mänskliga läsbara namnet innehåller mellanslag och versaler.
Om du vill lägga till flera menyer på din webbplats, lägg till den här koden på en ny rad istället:
function register_my_menus() { register_nav_menus( array( 'new-menu' => __( 'New Menu' ), 'another-menu' => __( 'Another Menu' ), 'an-extra-menu' => __( 'An Extra Menu' ) ) ); } add_action( 'init', 'register_my_menus' );
Du kan lägga till så många nya menyer du vill med den här metoden. Samma regler kommer att gälla för namngivning av dem.
Spara ändringar i filen. Allt som återstår är att lägga till den nya menyn på din webbplats.
Det är här du måste bestämma var du vill placera din meny. Om du vill att din meny ska visas högst upp på din sida, måste du ändra header.php att arkivera. Du kan också lägga den i sidfoten, vilket betyder att du skulle ändra footer.php släppa av.
Du kan till och med visa en meny på en sida genom att redigera dess mallfil eller på ett sidofält genom att redigera dess sidebar.php släppa av.
Du kan placera din nya meny var du vill. Här är den minsta mängd kod du bör lägga till på någon av dessa platser:
<?php wp_nav_menu( array( 'theme_location' => 'new-menu' ) ); ?>
bara byt ut new-menu
med det WordPress-läsbara namn du valde. Du vill förmodligen styla din meny med CSS så att den går utöver grundläggande funktionalitet och även ser bra ut. För att göra detta måste du skapa en klass och lägga till den i ditt tema med följande kod.
<?php wp_nav_menu( array( 'theme_location' => 'new-menu', 'container_class' => 'new_menu_class' ) ); ?>
Som tidigare, byt ut new-menu
med det namn du valde. I det här exemplet namngav jag klassen jag skapade new_menu_class
. Du kan ändra detta, men se till att uppdatera den här koden för att återspegla justeringen.
Slå den spara knappen och gå till Utseende> Menyer i din instrumentpanel. Du kommer att märka att dina nya menyer kommer att listas under Tematiska ställplatser i Menyinställningar sektion.
Du kommer nu att kunna se dina nya menyplatser listade. När du lägger till en meny kan du välja en eller alla platser.
Klicka på för att få länkarna att visas i dina nya menyplatser skapa en ny meny en haut de la page.
Om du inte har en meny ännu kan du ange ett namn för din meny i sidfältet och klicka sedan Skapa en meny. Om du redan har en tidigare skapad meny kan du klicka på skapa en ny meny länk till toppen av sidan.
När du har skapat en ny meny kan du även hantera platserna där de visas under fliken "Hantera platser".
Din nya meny är nu redo att stylas med CSS. Den kodning som krävs är specifik för det tema du använder, så jag kommer inte att gå in på det i den här artikeln, men vi har en annan artikel som du kan kolla in för den med titeln Hur man skapar en fantastisk responsiv meny för ditt WordPress-tema. Den visar dig också hur du skapar mobilanpassade responsiva menyer.
Om du vill ha ett enklare alternativ finns det gott om plugins som skapar responsiva menyer baserat på ditt temas stilar. En av de bästa jag har hittat är den responsiva menyn.
Några anmärkningsvärda omnämnanden som du också kan hitta användbara är ShiftNav, WP Responsive Menu och Max Mega Menu.
Resurser för att gå längre
Du har nu den solida grunden du behöver för att skapa ytterligare menyer för ditt tema och resurser som hjälper dig att gå längre. Oavsett om du kodar det själv, använder ett plugin eller ett temaramverk har du nu en ny meny på din WordPress-webbplats.
Om du har några problem, tveka inte att fråga våra supporthjältar. De kan ge dig expertråd och hjälpa dig att lösa nästan alla problem. Du kan öppna en biljett i vårt supportforum så finns vi där för att hjälpa dig.
För mer information om hur du stylar ditt nya tema, det finns massor av resurser du kan kolla in och du kan hitta dem alla i vår artikel A Mega Guide to Learning CSS and SEO for WordPress: 150+ Resources.
Du kan också kolla in några av våra andra artiklar 10 enkla tips för att lära dig CSS för WordPress, 25 experttips för renare CSS-kodning för WordPress, 25 proffstips för att förbättra ditt CSS-arbetsflöde och 5 gratis CSS-plugin-program för WordPress. liveredigering av din WordPress webbplats för mer information om kodning av CSS för ditt tema.
nyckelord: