Come migliorare il modello di pagina 404 in WordPress

404 errori non sono buoni per l'esperienza utente. Ti abbiamo mostrato come ricevere avvisi email per 404 errori sul tuo sito in modo da poterli risolvere rapidamente. In questo articolo, ti mostreremo come migliorare il tuo modello di pagina 404 in WordPress, in modo da poter creare una pagina 404 più utile che aiuti effettivamente gli utenti.

Come la maggior parte della pagina 404 di WordPress?

La pagina 404 è spesso la pagina più trascurata sulla maggior parte dei siti. Spesso un sacco di temi WordPress 404 pagina si presenta così:

Questa pagina 404 in WordPress è gestita da un file modello chiamato 404.php.

Se la tua configurazione è davvero incasinata, la pagina 404 sarà simile a questa:

Nessuna delle precedenti 404 pagine è veramente utile.

Quando un utente arriva su una pagina 404, sono già frustrati. Perché? Perché non riescono a trovare quello che stavano cercando.

Devi aiutare l'utente a trovare la pagina giusta. Puoi contribuire a rendere questa esperienza migliore trasmettendo correttamente l'errore e dando loro una linea di condotta corretta (e che cosa fare dopo).

Ciò può essere fatto mostrando loro altre sezioni dei siti che possono visitare, dando loro un modo per contattarti, ecc.

Come creare una pagina 404 personalizzata in WordPress

La prima cosa che dobbiamo fare è iniziare creando un modello di pagina 404 personalizzato. Questo può essere fatto modificando il file 404.php nel tuo tema WordPress.

Se stai modificando direttamente il tuo tema, ti consigliamo di eseguire almeno il backup del tuo tema WordPress.

Per rendere la tua pagina 404 più utile, ti mostreremo come aggiungere elementi utili come post popolari, la maggior parte dei post commentati, i post recenti, gli archivi di date, l'elenco di tutte le categorie, ecc..

Ciò consentirà ai nuovi utenti di dare una rapida occhiata a ciò che hai da offrire.

Mostra i post più popolari su 404 Page

Utilizzeremo uno dei migliori plugin per i post popolari di WordPress per visualizzare i post più popolari sulla nostra pagina 404.

La prima cosa che devi fare è installare e attivare il plugin Post popolari di WordPress sul tuo sito web. Dopo l'attivazione, è necessario aggiungere questo tag modello nel file 404.php in cui si desidera visualizzare i post popolari.

Mostra i post più commentati nella pagina 404

La sezione dei post più commentati si basa anche sul popolare plugin per i post che abbiamo attivato nell'ultimo passaggio. Aggiungi semplicemente questo tag modello nel punto in cui desideri visualizzare i tuoi post più commentati.

Puoi anche consultare la nostra guida su come visualizzare i post più commentati in WordPress.

Mostra i post recenti sulla pagina 404

Esistono diversi modi per visualizzare i post recenti in WordPress. Il modo più semplice è aggiungere questo tag modello nel modello 404 per visualizzare i post recenti.

  'postbypost', 'limit' => 10, 'format' => 'custom', 'before' => ", 'after' => '
')); ?> 

Mostra post casuali su 404 Page

Se vuoi visualizzare un elenco casuale di post in WordPress, puoi semplicemente aggiungere questo codice nel modello 404 in cui desideri visualizzare un elenco casuale di post dal tuo sito.

Aggiungi archivi mensili con archivi compatti

Se guardate la pagina WPBeginner 404, noterete che stiamo visualizzando la nostra lista di archivi mensili usando un plugin Compact Archives. Nota che abbiamo adottato questo plugin e ora lo stiamo mantenendo.

Installa e attiva questo plugin sul plugin Compact Archives. Dopo aver attivato il plugin, aggiungi il seguente codice nel tuo file 404.php:

 
Per data
 
  
 

Visualizzerà i tuoi archivi mensili in questo modo:

Un modello campione 404 per WordPress

Ecco un esempio di file 404.php basato sul tema 404 di WordPress del tema predefinito Twenty Thirteen.

            
Guarda alcuni dei nostri contenuti popolari:
   
Post popolari
      
più commentato
      
messaggi recenti
   'postbypost', 'limit' => 10, 'format' => 'custom', 'before' => ", 'after' => '
')); ?>       

Confronta questo modello 404 con il modello predefinito in Twenty Thirteen. Noterai che subito dopo il modulo di ricerca abbiamo aggiunto il nostro codice personalizzato per visualizzare i post più popolari, più commentati e recenti. Successivamente abbiamo aggiunto un piccolo CSS per dividerlo in colonne.

 .col1, .col2, .col3 width: 30%; float: sinistra; imbottitura: 0px 10px 10px 10px; altezza: 450px; margine: 0px;  .col3: after clear: both;  .col-header background: # 220e10; colore: #FFF; margine: 0px; padding: 1px; text-align: center;  

Ecco come appariva il risultato finale:

Speriamo che questo articolo ti abbia aiutato a migliorare la pagina 404 sul tuo sito WordPress. Sentiti libero di giocare con il codice e sperimentare diversi tag modello per soddisfare le tue esigenze.

Puoi anche usare questo elenco per interessanti esempi di design 404 come ispirazione.

Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per altri video WordPress. Puoi anche unirti a noi su Google+ e Twitter.