En navigeringsmeny utan en länk till startsidan är som en ytterdörr utan handtag. En besökare landar på en intern sida via sök, läser innehållet... och har ingen aning om var man klickar för att komma till startsidan. Logotypen i sidhuvudet hjälper inte alltid; en del användare letar instinktivt efter ett "Hem"-alternativ direkt i menyn.

Före version 3.0 hade WordPress inget sådant alternativ i den vanliga menyredigeraren, så du var tvungen att antingen redigera koden eller lägga till en anpassad länk manuellt. Nu är allt enklare: ett par klick så är hemlänken på plats. Och om du är utvecklare eller anpassar ett tema finns filtret wp_nav_menu_items som löser uppgiften med en enda funktion.

Nedan hittar du båda metoderna: en visuell för vanliga användare och en programmatisk för dig som arbetar med kod. Dessutom går vi igenom när länken behöver uppdateras och vad du ska göra om den plötsligt försvinner.

💡 Snabb översikt:

• Lägg till en hemlänk i WordPress-menyn via adminpanelen på under en minut utan tillägg.
• Lägg till länken programmatiskt med filtret wp_nav_menu_items i temats functions.php.
• Kontrollera och uppdatera webbadressen efter domänbyte eller övergång till HTTPS.

Metod 1: via WordPress adminpanel

Denna metod fungerar med WordPress 3.0 och senare, alltså på vilken modern webbplats som helst. Inga tillägg eller kodändringar krävs.

Logga in i adminpanelen och navigera till Utseende → Menyer. Till vänster ser du block: "Sidor", "Inlägg", "Anpassade länkar" och andra beroende på installerade tillägg och innehållstyper.

I blocket Sidor klickar du på fliken Alla (eller "Visa alla" i äldre versioner). Den allra första posten är en sida med namnet "Hem". Markera dess kryssruta och klicka på Lägg till i meny.

När objektet har lagts till visas det i menystrukturen till höger. Dra det till önskad position; det placeras vanligtvis först eller sist. Spara menyn genom att klicka på Spara meny, så blir hemlänken aktiv på din webbplats.

Som standard använder WordPress den direkta webbadressen till startsidan för detta objekt (till exempel https://vash-sait.ru/). Detta är viktigt att komma ihåg: om du senare flyttar webbplatsen till en annan domän eller byter från HTTP till HTTPS kommer länken att behålla den gamla adressen. Du måste då öppna menyredigeraren och korrigera webbadressen manuellt, eller ta bort objektet och lägga till det igen (WordPress infogar automatiskt den aktuella adressen).

Metod 2: programmatisk tillägg via ett filter

Om du utvecklar ett anpassat tema eller vill att hemlänken ska läggas till automatiskt när temat aktiveras, använd filtret wp_nav_menu_items. Det fångar upp HTML-koden för menyobjekt före utmatning och låter dig infoga ditt eget element.

Placera koden i functions.php för det aktiva temat (eller ett barntema så att du inte förlorar ändringar vid uppdatering). Ett alternativ är tillägget Code Snippets: du skapar en snutt, klistrar in koden och aktiverar den; ändringarna är då oberoende av temat.

1
/**
2
 * Adds a "Home" link to the main WordPress menu.
3
 *
4
 * @param string $items HTML markup of menu items.
5
 * @param object $args  wp_nav_menu() arguments.
6
 * @return string
7
 */
8
function sdstudio_add_menu_home_link( $items, $args ) {
9
    // Target menu location — replace 'main' with your own value
10
    if ( 'main' !== $args->theme_location ) {
11
        return $items;
12
    }
13
 
14
    $home_link = sprintf(
15
        '<li class="menu-item"><a href="%s">%s</a></li>',
16
        esc_url( home_url( '/' ) ),
17
        esc_html__( 'Home', 'textdomain' )
18
    );
19
 
20
    // The link is added first — put $items . $home_link if you need it last
21
    $items = $home_link . $items;
22
 
23
    return $items;
24
}
25
add_filter( 'wp_nav_menu_items', 'sdstudio_add_menu_home_link', 10, 2 );

Nyckelparametern är 'main' i if-villkoret. Detta är sluggen för menyområdet (temaplatsen) som registrerats av funktionen register_nav_menu() i temat. Du hittar din slug i temats functions.php: leta efter anropet till register_nav_menu() eller register_nav_menus() och kontrollera det första argumentet. Oftast är det primary eller main.

Funktionen är säker: esc_url() rensar webbadressen och esc_html__() rensar länktexten samtidigt som den stöder översättning. Om du använder ett barntema, ersätt 'textdomain' med ditt temas textdomän.

Efter att du infogat koden, uppdatera webbplatsen så visas hemlänken i menyn automatiskt. Du behöver inte ta bort den manuellt: kommentera bara bort eller ta bort anropet till add_filter() så återgår allt till ursprungsläget.

Situationer när länken behöver uppdateras

En hemlänk som lagts till via adminpanelen lagrar en hårdkodad webbadress, den som fanns i webbplatsens inställningar vid tillfället för tillägget. Tre vanliga scenarier när den slutar fungera:

• Byte från HTTP till HTTPS. Menyobjektet fortsätter att peka på http://..., webbläsare kan visa en varning för blandat innehåll eller så kan omdirigeringen misslyckas. Lösning: öppna menyredigeraren, ta bort det gamla "Hem"-objektet och lägg till det igen; WordPress infogar den aktuella https://-adressen.

• Byte av domän. När en webbplats flyttas från en utvecklingsmiljö till produktion (staging.site.ru → site.ru) eller migreras till en helt ny domän. Menyobjektet behåller den gamla webbadressen. Lösning: samma som ovan (ta bort och lägg till igen).

• Flytt från en underkatalog till roten. Om webbplatsen flyttas från site.ru/blog/ till site.ru/ slutar alla hårdkodade länkar att fungera. Efter migrering, gå igenom ALLA menyobjekt, inte bara hemlänken.

Den programmatiska metoden (via wp_nav_menu_items) har inte dessa problem: home_url('/') returnerar alltid den aktuella startsidadressen från WordPress inställningar.

Förresten, om du arbetar med menyer ofta, kolla in navigeringsinställningarna under Utseende → Anpassa, där du kan hantera menyer i realtid med en live-förhandsvisning. För avancerade redigeringar (lägga till ikoner till objekt, megamenyer) finns det dedikerade verktyg, men det är ett ämne för en annan artikel.

Video: lägga till en hemknapp på 2 minuter

Om du föredrar att titta framför att läsa, här är en kort engelskspråkig video med en steg-för-steg demonstration på skärmen:

⁉️🤔 Vanliga frågor

Kan jag lägga till en hemlänk utan tillägg eller kod?

Ja, genom den vanliga WordPress menyredigeraren: Utseende → Menyer → Sidblocket → markera "Hem" → Lägg till i meny. Detta är kärnfunktionalitet tillgänglig sedan version 3.0.

Varför försvann hemlänken från menyn efter temabyte?

Menyer i WordPress är knutna till menyområden (temaplatser) som registreras av temat. När du byter tema försvinner de gamla områdena och de nya kan ha andra namn. Din meny har inte försvunnit; den blev bara "otilldelad". Gå till Utseende → Menyer → fliken Hantera platser och tilldela den befintliga menyn till ett område i det nya temat. Alla objekt, inklusive hemlänken, kommer tillbaka.

Menyn har redan ett "Hem"-objekt, men det leder till någon specifik sida snarare än webbplatsens rot. Hur fixar jag detta?

Troligtvis har en specifik sida med titeln "Hem" lagts till i menyn istället för den särskilda typen "Startsida". Ta bort det objektet från menyn, leta sedan i Sidblocket upp posten märkt "Startsida" (WordPress markerar den tydligt) och lägg till den. Om det inte finns någon sådan etikett, använd "Anpassade länkar": i fältet för webbadress anger du /, och i fältet "Länktext" skriver du "Hem".

Hur lägger jag till hemlänken sist i menyn istället för först?

I den programmatiska metoden byter du ordning på konkateneringen: istället för $home_link . $items skriver du $items . $home_link. I den visuella redigeraren drar du helt enkelt "Hem"-objektet till slutet av listan och sparar menyn.

Är det nödvändigt att använda esc_url() och home_url() i koden?

Ja, detta är bästa praxis för WordPress. home_url('/') infogar dynamiskt den aktuella webbplatsadressen från inställningarna, så du behöver inte redigera koden vid domänbyte. esc_url() rensar specialtecken och skyddar mot XSS-attacker. Att hoppa över rensning i produktionskod är riskabelt.

Fungerar kodmetoden på en WordPress multisite-installation?

Ja, home_url( '/' ) på multisite returnerar webbadressen för den specifika webbplatsen inom nätverket (den som anges i den underwebbplatsens inställningar). Varje webbplats i nätverket får sin egen hemlänk. Om du behöver olika beteende för olika webbplatser, omslut anropet till add_filter() i ett villkor som kontrollerar blogg-ID via get_current_blog_id().

Vad ska jag göra om hemlänken inte visas?

Kontrollera först det uppenbara: sparade du faktiskt menyn efter att du lagt till objektet? Knappen "Spara meny" finns längst ner på sidan; utan att klicka på den tillämpas inte ändringarna. Om menyn är sparad men objektet saknas, öppna webbplatsen i inkognitoläge (webbläsarens cache döljer ibland senaste ändringar).

Den näst troligaste orsaken är ett cachingtillägg (WP Rocket, W3 Total Cache, LiteSpeed Cache). Rensa cachen via tilläggets adminpanel och kontrollera webbplatsen igen.

Om det inte hjälper, byt tillfälligt tema till ett standardtema (Twenty Twenty-Five eller Twenty Twenty-Six). Dök objektet upp? Då ligger problemet i det anpassade temat; dess wp_nav_menu()-funktion kan vara överskuggad med filter borttagna. Kontrollera anropet till wp_nav_menu() i temamallen: argumentet 'items_wrap' bör inte vara en tom sträng, och 'fallback_cb' bör vara false endast om du avsiktligt inaktiverar reservfunktionen.

Koden från "Metod 2" fungerar på vilket tema som helst så länge theme_location är korrekt; den fungerar som en försäkring ifall den visuella metoden av någon anledning misslyckas.

En hemlänk i menyn är en liten detalj som bygger förtroende. En besökare som landar på en intern sida från sök hittar vägen tillbaka till start på en bråkdels sekund och fortsätter utforska. Utan den kommer en del av din publik helt enkelt att stänga fliken. Två minuter i menyredigeraren eller tio rader kod, så går denna ingångspunkt aldrig förlorad igen.