Så här förbättrar du din 404-sidmall i WordPress

404 fel är inte bra för användarupplevelse. Vi visade dig hur du får e-postmeddelanden för 404 fel på din webbplats så att du snabbt kan fixa dem. I den här artikeln visar vi hur du förbättrar 404-sidmallen i WordPress så att du kan skapa en mer användbar 404-sida som verkligen hjälper användare.

Hur de flesta WordPress 404-sidor ser ut?

404 sida är ofta den mest försummade sidan på de flesta webbplatser. Ofta ser många WordPress-teman 404 på följande sätt:

Den här 404-sidan i WordPress hanteras av en mallfil som heter 404.php.

Om din konfiguration är riktigt förstörd så ser 404-sidan ut så här:

Varken ovanstående 404 sidor är verkligen användbara.

När en användare landar på en 404-sida, är de redan frustrerade. Varför? Eftersom de inte kan hitta vad de letade efter.

Du behöver hjälpa användaren att hitta rätt sida. Du kan hjälpa till att göra denna upplevelse bättre genom att korrekt överföra felet och ge dem en rättvisande åtgärd (dvs vad som ska hända).

Detta kan göras genom att visa dem andra delar av dina webbplatser som de kan besöka, ge dem ett sätt att kontakta dig, etc..

Så här skapar du en anpassad 404-sida i WordPress

Det första vi behöver göra är att börja med att skapa en anpassad 404-sidmall. Detta kan göras genom att redigera filen 404.php i ditt WordPress-tema.

Om du redigerar ditt tema direkt, vill vi uppmanas att åtminstone säkerhetskopiera ditt WordPress-tema.

För att göra din 404-sida mer användbar, kommer vi att visa dig hur du lägger till användbara element som populära inlägg, mest kommenterade inlägg, senaste inlägg, datumarkiv, lista över alla kategorier etc.

Detta gör det möjligt för nya användare att få en snabb blick på vad du har att erbjuda.

Visa mest populära inlägg på 404 sida

Vi kommer att använda en av de bästa WordPress populära inlägget plugins för att visa populära inlägg på vår 404 sida.

Det första du behöver göra är att installera och aktivera WordPress Popular Posts-plugin på din webbplats. Vid aktivering måste du lägga till den här malltaggen i din 404.php-fil där du vill visa de populära inläggen.

Visa mest kommenterade inlägg på 404 sida

Den mest kommenterade inläggssektionen är också beroende av det populära inlägget plugin vi aktiverade i det sista steget. Lägg bara till den här malltaggen där du vill visa dina mest kommenterade inlägg.

Du kan också kolla in vår guide om hur du visar de flesta kommenterade inlägg i WordPress.

Visa senaste inlägg på 404 sida

Det finns flera sätt att visa senaste inlägg i WordPress. Det enklaste sättet är att lägga till den här malltaggen i din 404-mall för att visa dina senaste inlägg.

  'postbypost', 'limit' => 10, 'format' => 'anpassat', 'före' => ", 'efter' => '
')); ?> 

Visa slumpmässiga inlägg på 404 sida

Om du vill visa en slumpmässig lista med inlägg i WordPress kan du helt enkelt lägga till den här koden i din 404-mall där du vill visa en slumpmässig lista över inlägg från din webbplats.

Lägg till månadsarkiv med kompaktarkiv

Om du tittar på WPBeginner 404-sidan kommer du att märka att vi visar vår månadsarkivlista med hjälp av ett kompakt arkiv för plugin. Observera att vi har antagit det här pluginet och nu behåller det.

Installera och aktivera det här pluginet i Compact Archives-plugin. När du har aktiverat plugin lägger du till följande kod i din 404.php-fil:

 
Efter datum
 
  
 

Den visar dina månadsarkiv så här:

Ett exempel på 404-mall för WordPress

Här är en sample 404.php-fil baserat på standard WordPress-tema Tjugo Trettons 404-mall.

            
Kolla in några av vårt populära innehåll:
   
populära inlägg
      
Mest kommenterade
      
Nya Inlägg
   'postbypost', 'limit' => 10, 'format' => 'anpassat', 'före' => ", 'efter' => '
')); ?>       

Jämför denna 404 mall med standardmallen i tjugo tretton. Du märker att direkt efter sökformuläret har vi lagt till vår anpassade kod för att visa populära, mest kommenterade och senaste inlägg. Därefter lade vi till en liten CSS för att dela upp den i kolumner.

 .col1, kol2, kol3 bredd: 30%; flyta till vänster; vaddering: 0px 10px 10px 10px; höjd: 450px; marginal: 0px;  .col3: efter clear: both;  .col-header background: # 220e10; färg: #fff; marginal: 0px; padding: 1px; text-align: center;  

Så här ser slutresultatet ut:

Vi hoppas att den här artikeln hjälper dig att förbättra 404-sidan på din WordPress-webbplats. Känn dig fri att leka med koden och experimentera med olika malltaggar för att möta dina behov.

Du kan också använda dessa listor för coola 404 design exempel som inspiration.

Om du gillade den här artikeln kan du prenumerera på vår YouTube-kanal för fler WordPress-videor. Du kan också gå med oss ​​på Google+ och Twitter.