Skip to content

Allt om WordPress, webbutveckling — och mer därtill

🚀 Hur man skapar en arkivsida för anpassade inläggstyper i WordPress

🚀 Hur man skapar en arkivsida för anpassade inläggstyper i WordPress

När en sajt växer förbi stadiet "blogg plus några sidor" räcker inte längre vanliga inlägg och kategorier. Portföljer, team, kundomdömen, case-studier, jobbannonser: allt detta vill leva i sin egen struktur i stället för att klämmas in i det allmänna inläggsflödet med kategorilösningar.

WordPress löser problemet genom anpassade inläggstyper. Men att skapa en CPT räcker inte; du behöver också en sida där alla poster av den typen samlas: en arkivsida. Utan den får besökarna helt enkelt inte se dina portföljobjekt eller teammedlemmar presenterade som ett enhetligt block.

Grid-plugins som Essential Grid hanterar det visuella, men de lägger till extra CSS och JS. På små projekt märks det inte, men på en sajt med tiotusentals besökare räknas varje kilobyte. Den inbyggda arkivmekanismen i WordPress ger samma funktionalitet utan frontend-overhead, och det tar bara 10 minuter att konfigurera.

💡 Snabb översikt:

  • Skapa en anpassad inläggstyp via CPT UI och aktivera arkivstöd i inställningarna direkt
  • Skriv en anpassad mall för exakt layoutkontroll om det behövs
  • Konfigurera SEO-metadata via Yoast SEO: titel, beskrivning och og:image för arkivsidan
  • Inaktivera sidofältet och lägg till Open Graph-uppmärkning om det behövs

1. Skapa en anpassad inläggstyp

Det enklaste och mest pålitliga sättet att registrera en CPT utan en enda rad kod är pluginet Custom Post Type UI. Det är installerat på över en miljon sajter och har underhållits sedan 2010, och gränssnittet är intuitivt: formulärfälten motsvarar ett till ett argumenten i funktionen register_post_type().

Sidan för Custom Post Type UI-tillägget i WordPress arkiv

Efter att du installerat pluginet, gå till CPT UI → Add/Edit Post Types. Fyll i det minimala:

  • Post Type Slug: latinska tecken, inga mellanslag (till exempel portfolio)
  • Plural Label: "Portfolio"
  • Singular Label: "Work"

Du kan lämna resten av inställningarna på sina standardvärden; standardvärdena täcker de allra flesta typiska scenarier. Klicka på Add Post Type, så dyker den nya typen upp i adminpanelen som ett separat menyalternativ.

2. Konfigurera arkivsidan

För att poster av den nya typen ska samlas på en separat sida måste du uttryckligen aktivera arkivstöd. Det är inaktiverat som standard.

Gå till CPT UI → Edit Post Types och välj typen du skapade från listan:

Sidan för redigering av anpassad innehållstyp i CPT UI

Scrolla ner till sektionen Settings och fyll i två nyckelfält:

Fälten Has Archive och Custom Rewrite Slug i CPT UI
  • Has Archive: sätt till True. Detta är strömbrytaren för arkivsidan.
  • Custom Rewrite Slug: sluggen där arkivet ska vara tillgängligt. Matchar vanligtvis inläggstypens slug (till exempel portfolio).

Spara dina ändringar och navigera till http://YOUR_SITE/portfolio. Du kommer att se en lista över alla poster av denna typ, formaterade med det aktiva temats standardmall archive.php:

Exempel på arkivsida för portfölj-innehållstypen

Grundsidan är klar. Om standardutseendet är tillräckligt kan du stanna här. Men i de flesta fall vill du finslipa utseendet.

3. Anpassad archive-{posttype}.php-mall

WordPress använder en tydlig mallhierarki. När en besökare landar på en CPT-arkivsida letar kärnan efter filer i denna ordning:

  • archive-{posttype}.php
  • archive.php
  • index.php

Det betyder att du bara behöver skapa en fil med namnet archive-portfolio.php (där portfolio är din inläggstypsslug), så plockar WordPress upp den automatiskt.

Steg:

Kopiera innehållet i ditt temas archive.php till en ny fil archive-portfolio.php. Modifiera sedan uppmärkningen efter dina behov: dölj datumet om det inte är relevant för en portfölj; visa tumnageln i en annan storlek; ersätt standardfunktionen the_excerpt() med the_content().

1<?php
2/* Template for Portfolio archive — overrides archive.php */
3
4if ( have_posts() ) {
5 while ( have_posts() ) {
6 the_post();
7 // Your custom markup here
8 the_post_thumbnail( 'medium' );
9 the_title( '<h3>', '</h3>' );
10 the_excerpt();
11 }
12}

Om du arbetar med ett FSE-tema (Block Theme) skapas arkivmallen i sajtredigeraren: Appearance → Editor → Templates → Add New Template → Archive: Portfolio. Ingen PHP, enbart block, men logiken är densamma: anpassad layout för en specifik CPT.

4. SEO-optimering för arkivsidan

En arkivsida är inte bara en praktisk URL. Sökmotorer indexerar den, och den kan lätt driva trafik för kommersiella sökningar som "webbstudio portfölj" eller "byrå team".

Om du har Yoast SEO installerat konfigureras metadata för CPT-arkiv på ett ställe:

Innehållstypsinställningar i Yoast SEO för anpassade inlägg

Öppna Yoast SEO → Settings → Content Types, hitta din anpassade inläggstyp och expandera sektionen. Ange mallar för titel och metabeskrivning:

Mallfält för titel och beskrivning för arkivsidan i Yoast SEO

Rekommenderade mallar:

  • Titel: %%pt_plural%% %%page%%, %%sitename%%
  • Metabeskrivning: %%pt_plural%%, work samples, case studies and projects. %%sitename%%

Yoast ersätter automatiskt variablerna %%pt_plural%% och %%pt_single%% från dina CPT-inställningar. Glöm inte att inaktivera noindex för arkivsidan om den är aktiverad som standard; kryssrutan Show in search results måste vara aktiv.

5. Open Graph-uppmärkning och sidofält

För att säkerställa att en bild hämtas när arkivsidans länk delas på sociala medier, lägg till og:image via wp_head-hooken. Infoga koden i ditt aktiva temas functions.php eller via Code Snippets-pluginet:

1add_action( 'wp_head', 'cpt_archive_og_image' );
2function cpt_archive_og_image() {
3 if ( is_post_type_archive( 'portfolio' ) ) {
4 echo '<meta property="og:image" content="' .
5 get_template_directory_uri() . '/images/portfolio-og.jpg' . '" />';
6 }
7}

Villkoret is_post_type_archive() triggar endast på den specifika CPT:ns arkivsida, så uppmärkningen påverkar inte andra sidor. Placera bilden i din temamapp eller ladda upp den via mediebiblioteket och använd den direkta URL:en.

En sista detalj: sidofältet. På arkivsidor är det ofta onödigt, särskilt för portföljer eller team där kortbredd spelar roll. De flesta moderna teman låter dig inaktivera sidofältet i sidinställningarna:

Inställningar för sidopanelsväxling i temats visuella redigerare

I blockteman, växla mallen till Full Width i arkivsidans inställningar. I klassiska teman, leta efter Page Attributes → Template → Full Width i anpassaren eller redigeringsmetaboxen.

📺 Video: hela processen på 8 minuter

En kort engelsk demo som täcker CPT-skapande, aktivering av arkivet och en anpassad mall från första klick till färdig sida:

⁉️🤔 Vanliga frågor

Varför returnerar arkivsidan en 404 efter att jag skapat CPT:n?

Troligtvis aktiverade du inte parametern Has Archive. Gå till CPT UI → Edit Post Types, hitta din typ, sätt Has Archive till True och ange en Custom Rewrite Slug. Efter att du sparat, se till att gå till Settings → Permalinks och klicka på "Save Changes"; detta tömmer cachen för omskrivningsregler.

Kan jag hoppa över CPT UI-pluginet?

Ja, anpassade inläggstyper kan registreras i functions.php via funktionen register_post_type(). Det tar ungefär 15-20 rader kod, ett par minuter för en utvecklare. Pluginet ger helt enkelt ett visuellt gränssnitt och förhindrar stavfel i argumenten.

Hur visar jag CPT-poster på startsidan?

Lägg till 'has_archive' => true i argumenten för register_post_type(), och för att inkludera poster i huvudflödet, sätt 'public' => true och 'exclude_from_search' => false. För riktad visning, använd WP_Query med argumentet 'post_type' => 'portfolio'.

Vad är skillnaden mellan archive-{posttype}.php och taxonomy-{taxonomy}.php?

Den första hanterar sidan med ALLA CPT-poster; den andra hanterar filtrering efter en specifik taxonomiterm (till exempel "Projekttyp: landningssida"). Båda följer mallhierarkin men triggas på olika URL:er.

Är en anpassad mall obligatorisk?

Nej. Om standardmallen archive.php passar dig, aktivera bara Has Archive och använd den. En anpassad mall behövs när du kräver unik uppmärkning: andra tumnagelstorlekar, inga datum, ett grid i stället för en lista.

Vad händer om standardmallen inte fungerar för dig?

En arkivsida för anpassade inlägg är något du ställer in en gång och sedan glömmer. CPT UI plus några rader i functions.php täcker problemet fullständigt: inga allt-i-ett-plugins, ingen extra kod på frontend.

Om du fortfarande har frågor om en specifik tema- eller pluginkombination efter att ha läst detta, lämna en kommentar under inlägget. Vi undersöker ditt fall separat.