De flesta WordPress-sajter har inte en enda sida som listar allt på ett ställe, så besökare måste förlita sig på menyer eller sökning för att snubbla över rätt innehåll.
En HTML-sitemap löser detta genom att placera allt ditt viktiga innehåll på en sida. I den här guiden visar vi dig hur du skapar en med ett plugin och utan kodavsnitt.
Vad är skillnaden mellan XML- och HTML-webbplatser?
En XML-sitemap är en fil som listar allt ditt webbplatsinnehåll i ett format som sökmotorer som Google kan läsa. Du kan skicka in den i Google Search Console för att hjälpa sökmotorer att hitta och genomsöka dina sidor snabbare.
En HTML-sitemap fungerar annorlunda. Tänk på det som en anslagstavla i ett köpcentrum.
Istället för att guida sökmotorer, guidar den dina besökare och listar dina inlägg och sidor på en organiserad sida så att folk snabbt kan hitta det de kom för.
Nu när du vet skillnaden, låt oss titta på hur du lägger till en HTML-sitemap på din WordPress-sajt. Du kan använda snabblänkarna nedan för att hoppa direkt till den metod du vill använda:
Metod 1: Lägg till HTML-sitemap-sida i WordPress med All in One SEO
Att använda ett WordPress SEO-plugin, som det kostnadsfria All in One SEO-pluginet, är det enklaste sättet att lägga till en HTML-sitemap-sida med några få klick.
Eftersom pluginet redan hanterar din XML-sitemap och dina grundläggande SEO-inställningar, kan du hantera båda från samma ställe istället för att installera ett separat verktyg bara för detta.
Först måste du installera och aktivera pluginet. Vid aktivering öppnas installationsguiden, där du kan klicka på knappen 'Låt oss komma igång'.
Om du vill ha en fullständig genomgång av varje inställning, se vår guide om hur du ställer in All in One SEO för WordPress.
När du är klar, gå till All in One SEO » Sitemaps och klicka på fliken 'HTML Sitemap'. Slå sedan på växlingsknappen 'Aktivera Sitemap'.
Välj sedan hur du vill visa din sitemap. För den här handledningen väljer vi alternativet 'Dedikerad sida'. Alternativt kan du lägga till den som en kortkod, block eller widget.
När du gör det, ange URL:en där du vill att din sitemap ska visas, så skapar pluginet automatiskt den sidan åt dig.
Notera: Eftersom All in One SEO skapar den här sidan dynamiskt, kommer den inte att visas i din lista över sidor i WordPress adminområde. Du kan alltid återgå till den här inställningsskärmen för att göra ändringar.
Rulla sedan ner till avsnittet 'HTML Sitemap Settings'. Här kan du välja vilka inläggstyper och taxonomier, som kategorier och taggar, som ska visas i din sitemap.
Om du vill ha mer kontroll, låter 'Avancerade inställningar' dig utesluta specifika inlägg, sidor eller termer från listan.
Du kan också aktivera 'Kompakta arkiv' om du hellre vill visa din sitemap som ett kompakt datumarkiv istället för en fullständig lista. När du är nöjd med dina inställningar, klicka på 'Spara ändringar'.
Din HTML-sitemap är nu live. Om du valde alternativet 'Dedikerad sida' kan du se den genom att klicka på knappen 'Öppna HTML-sitemap'.
Metod 2: Lägg till HTML-sitemap-sida i WordPress med kod
Om du inte vill använda All in One SEO eftersom du inte behöver alla dess andra funktioner, kan du skapa en HTML-sitemap genom att lägga till anpassad kod i ditt barntems functions.php-fil.
Men det minsta misstaget kan förstöra hela din webbplats och orsaka WordPress vita skärm av döden.
Därför rekommenderar vi att du använder ett plugin för kodavsnitt som WPCode. Dess gratisversion låter dig lägga till och hantera din kod säkert utan att röra dina temafiler.
Det första du behöver göra är att installera och aktivera WPCode-pluginet. För mer information, se vår steg-för-steg-guide om hur man installerar ett WordPress-plugin.
När det är aktivt, gå till Kodavsnitt » + Lägg till avsnitt från din WordPress-instrumentpanel. Håll muspekaren över 'Lägg till din anpassade kod (nytt avsnitt)' och klicka på 'Använd avsnitt'.
På den nya skärmen, välj 'PHP-avsnitt' som kodtyp och ge ditt avsnitt en titel så att du kan hitta det senare. Det kan vara något som 'HTML Sitemap'.
Klistra sedan in följande kod i rutan 'Kodförhandsgranskning'.
function custom_html_sitemap() {
$out = '<ul class="custom-sitemap">';
// Pages
$pages = get_pages(
array(
'sort_column' => 'menu_order,post_title',
'post_status' => 'publish',
)
);
foreach ( $pages as $page ) {
$out .= sprintf(
'<li><a href="%s">%s</a></li>',
esc_url( get_permalink( $page->ID ) ),
esc_html( get_the_title( $page->ID ) )
);
}
// Recent posts
$recent_posts = get_posts(
array(
'posts_per_page' => 50,
'post_status' => 'publish',
'orderby' => 'date',
'order' => 'DESC',
'post_type' => 'post',
'ignore_sticky_posts' => true,
)
);
foreach ( $recent_posts as $p ) {
$out .= sprintf(
'<li><a href="%s">%s</a></li>',
esc_url( get_permalink( $p->ID ) ),
esc_html( get_the_title( $p->ID ) )
);
}
$out .= '</ul>';
return $out;
}
add_shortcode( 'custom_html_sitemap', 'custom_html_sitemap' );
Denna kod listar först alla dina publicerade sidor, sedan dina 50 mest senaste inlägg, och paketerar allt i en kortkod som kallas [custom_html_sitemap] som du kan placera på vilken sida som helst.
När du är klar, växla omkopplaren högst upp från 'Inaktiv' till 'Aktiv', klicka sedan på 'Spara avsnitt'.
Skapa nu en ny sida genom att gå till Sidor » Lägg till ny, eller öppna en befintlig sida där du vill att din sitemap ska visas. Lägg till ett 'Kortkod'-block och klistra in följande kortkod i det:
[custom_html_sitemap]
När du publicerar sidan kommer dina besökare att se en enkel lista över dina sidor och senaste inlägg, alla länkade och redo att bläddra.
Vanliga frågor om HTML-webbplatskarta
Är en HTML-sitemap bra för SEO?
Ja. En HTML-sitemap lägger till en intern länk till varje viktig sida på din webbplats, vilket hjälper sökmotorer att upptäcka ditt innehåll. Det gör också din webbplats lättare för besökare att navigera.
Uppdateras HTML-sitemappen automatiskt när jag lägger till nytt innehåll?
Ja. Oavsett om du använder All in One SEO eller den anpassade kodmetoden ovan, uppdateras din sitemap automatiskt när du publicerar ett nytt inlägg eller en ny sida. Du behöver inte göra något extra för att hålla den aktuell.
Var ska jag placera min HTML-sitemap?
Den vanligaste platsen att länka till din HTML-sitemap är din webbplats sidfot. Detta gör den tillgänglig från vilken sida som helst utan att belamra din huvudsakliga navigeringsmeny.
Ett annat bra ställe är din 404-felsida. Om en besökare hamnar på en trasig länk, kan en länk till din HTML-sitemap hjälpa dem att hitta det de letade efter.
Hur lägger jag till min nya HTML-sitemap-sida i min navigeringsmeny?
När du har publicerat din sitemap, gå till Utseende » Menyer i din WordPress admin-instrumentpanel för att lägga till den i valfri meny. Om du använde anpassad kodmetod, markera rutan bredvid din nya sida.
Men om du använde All in One SEO kommer din dynamiskt skapade sida inte att visas i listan Sidor. Du måste klicka på fliken 'Anpassade länkar' för att klistra in din sitemaps URL.
Om du använder ett blocktema måste du istället lägga till länken via Webbplatsredigeraren.
Videohandledning
Vi hoppas att den här artikeln hjälpte dig att lära dig hur du lägger till en HTML-sitemap-sida i WordPress. Du kanske också vill se hur du visar brödsmule-navigering i WordPress och vår omfattande WordPress SEO-guide.
Om du gillade den här artikeln, prenumerera gärna på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.
Linh
Hittills gäller dessa 2 metoder inte min webbplats eftersom jag bara vill välja en specifik kategori som ska visas på HTML-sitemappen. Varken AIOSEO eller SimpleSitemap tillåter mig att göra det. Naturligtvis har jag provat Avancerade inställningar (bara AIO har det) men då måste jag manuellt välja varje enskilt inlägg eller sida som ska exkluderas från sitemappen. Detta manuella krav dödar helt enkelt syftet med att använda plugins för att skapa en HTML-sitemap.
En annan sak med denna AIO (som wpbeginner marknadsför den hela tiden och får mig att känna att den är som en allsmäktig plugin) är med brödsmulan:
Denna funktion från AIO följer helt enkelt INTE URL-logiken! Mer specifikt, den visas bara snyggt på din webbplats tills du klickar på den för att komma tillbaka till föregående sida (eller föräldrasidan), vilket varje människa gör när de surfar på någon webbplats. AIO kommer att föra dig till andra sidor (vilket är arkivsidan). Personligen förstår jag inte det.
För mig, förutom SEO-verktyg, erbjuder AIO en för grundläggande funktion, för att inte säga, oanvändbar när det gäller självhostade webbplatser.
WPBeginner Support
Tack för din feedback, om du bara ville ha några av dina inlägg och sidor på en specifik sida istället för en samling av alla dina inlägg och sidor skulle vi rekommendera att du manuellt skapar den lista du önskar och det bör uppnå det du vill, såvida vi inte missförstår målet du försöker uppnå.
Angående ditt uttalande om brödsmulor, brödsmulor finns där för att länka till organisationen av ditt innehåll och inte specifikt vara en bakåtknapp, normalt skulle det göras av webbläsaren eller en alternativ metod.
Admin
Jiří Vaněk
Jag har alltid ansett en sitemap som ett verktyg för att förbättra SEO och visa Google eller andra sökmotorers robotar innehållet på mina sidor. Det är intressant hur man ibland fokuserar så mycket på sökmotorer att man glömmer att göra webbplatsen mer tillgänglig för vanliga användare. Jag skapade en HTML-sitemap och placerade den på webbplatsen så att folk lättare kan navigera innehållet om de vill. Tack för den nya insikten att en sitemap kan tjäna användare lika bra som robotar.
Dennis Muthomi
Hej WPBeginner, tack för den här informativa artikeln
Jag har alltid fokuserat på XML-webbplatser för sökmotorer, men jag ser nu värdet av HTML-webbplatser för användarnavigering.
Tack för instruktionerna för att använda All in One SEO.
Robert Thompson
WordPress vill att jag ska betala dem 300 dollar bara för att uppgradera till deras företagsplan så att jag kan få tillgång till deras plugins. Jag avstår från deras erbjudande.
WPBeginner Support
Det skulle vara en begränsning om du använder WordPress.com, våra handledningar är för WordPress.org-webbplatser. Du kan se skillnaden mellan de två i vår artikel nedan!
https://014.leahstevensyj.workers.dev/beginners-guide/self-hosted-wordpress-org-vs-free-wordpress-com-infograph/
Admin
Faraz Ahmed
Hur kan jag visa en webbplatskarta specifik för kategorier?
WPBeginner Support
Det andra pluginet från den här artikeln bör låta dig separera innehållet efter kategori.
Admin
Carol
Kan inte få POSTS att visas som sidor gör, så det är värdelöst för mig. På min webbplats är sidor statiskt innehåll, Om oss, etc. Men inlägg är de nya artiklarna som folk vill se direkt. Jag gör research om olika ämnen och det är hjärtat och själen i min blogg. Jag vill att de ska se det nya materialet i ordning om det ämnet, i en lista. Jag bryr mig verkligen inte om Sidor, Sekretess, Cookies, Om oss, sådant som man tittar på en gång, kanske, om någonsin.
Jag har experimenterat med koden, får bara KODEN på den färdiga sidan.
Vad kan jag göra?
WPBeginner Support
Hej Carol,
Se vår artikel om hur du lägger till ämnen i WordPress navigeringsmenyer.
Admin
Shawn
Jag skulle vilja generera en webbplatskarta med alla mina woocommerce-butikskategorier och produkter. Kan detta plugin göra det?
Raghvendra Singh Jadon
kan vi inte skapa en sitemap-sida som integritetspolicy eller kontakta oss
Deepa
är det möjligt om vi kan skapa vår egen webbplatskarta
Shirish
Riktigt mycket trevlig och användbar artikel.
Ibu Solihatun
Artikeln är mycket intressant. Hjälpte mig att förstå många saker och kommer snart att vara glad att skriva så igen.
Minne
Tack så mycket, den här webbplatskartan är otroligt finjusterad, absolut perfekt och har sparat mig mycket tid.
Srekanth
hur kan jag skapa xml-sitemap som html-sida finns det några möjligheter
Adilop
Herr, räcker inte sitemappen från Yoast-pluginen?
WPBeginner Support
Läs avsnittet om skillnaden mellan XML- och HTML-webbplatskartor.
Admin
Adilop
Tack för ditt förslag, herr.
Blane Beckwith
Jag lade till en HTML-webbplatskarta till min webbsida, och det blev en mycket snygg och funktionell arkivsida.
Connor Rickett
Det är aldrig en dålig idé att ha en sitemap för dina besökare. Bara som en sidonotering, när/om du skickar din sitemap till Google, se till att det är XML-versionen!
Natascha
Vad jag dock saknar är, varför skulle någon behöva en HTML-sitemap eller när rekommenderas det? Kanske en kort lista med för- och nackdelar skulle hjälpa. Tack
WPBeginner Support
Det är mer användbart för webbplatser med statiskt och icke-kronologiskt innehåll, dvs. sidor. En sitemap-sida kan hjälpa användare att se alla sidor i sin hierarkiska ordning.
Admin