Come modificare una pagina 404 in WordPress (Guida alla personalizzazione) | Appassionati di WP

Pubblicato: 2022-01-07

Ogni creatore di contenuti e amministratore del sito sa che i piccoli dettagli contano molto e non c'è una seconda impressione su Internet. Una bella combinazione di colori, un eccellente effetto di animazione o una pagina 404 attraente sono dettagli che creano o rompono l'esperienza dell'utente.

Una pagina 404 è l'espressione tecnica che descrive le situazioni in cui una pagina non viene trovata. Ad esempio, potrebbe essere perché l'utente ha digitato erroneamente un URL nella scheda del browser o che la pagina Web non è più online.

Nei paragrafi seguenti imparerai come modificare una pagina 404 in WordPress. Una pagina 404 attraente è la soluzione migliore per superare un momento imbarazzante. Invece di deludere i visitatori del sito, un'eccellente pagina 404 contribuirà a una migliore immagine del tuo marchio.

Che cos'è una pagina 404

Si fa clic su un collegamento o si digita un indirizzo URL nella scheda del browser. Successivamente, il browser inizia a richiedere dati dal server che ospita il sito Web che desideri visitare. Questa è una spiegazione di base della navigazione in Internet. Lo scambio di informazioni tra browser e server implica, tra molti altri, alcuni codici di stato. Inoltre, ci sono stati per descrivere il reindirizzamento della pagina Web, gli errori del client o del server o gli scopi informativi.

Tutti i codici di stato con modulo 4XX riguardano errori del cliente. Ad esempio, 403 Forbidden è quando il server comprende la richiesta del browser ma si rifiuta di fornire i dati. La pagina 404 è di gran lunga il codice di stato più famoso. Si ottiene una pagina 404 quando si fa clic su un collegamento interrotto, si digita un URL errato che porta a una pagina Web inesistente o se la risorsa richiesta non è mai esistita.

Anche i siti essenziali, come le notizie di grandi riviste o i negozi molto visitati, potrebbero contenere un errore di 404 pagine. Certo, è inevitabile, ma dovresti sapere come superare la situazione imbarazzante. Quindi, sarebbe d'aiuto se facessi tutto il possibile per creare una bella pagina di errore 404 per il tuo sito.

L'anatomia di una buona pagina 404

Immagine di 404 Page Design di tiktok.com come esempio di come modificare una pagina 404 in WordPress.
Design a 404 pagine di tiktok.com

Alcuni siti Web ottengono un backlink e un riconoscimento pubblico menzionandoli in elenchi con fantastiche 404 pagine. I visitatori del sito apprezzano un buon design o un messaggio umoristico su una pagina 404. Questo dovrebbe convincerti che una bella pagina di errore 404 è una priorità per le tue attività online. Ecco cosa dovrebbe includere una buona pagina 404:

Il messaggio di errore: gli utenti dovrebbero rendersi conto di un problema dal momento in cui atterrano su una pagina 404. Rendilo esplicito in modo che tutti capiscano.

Collegamenti ai tuoi contenuti: non desideri che gli utenti abbandonino il tuo sito. Fornisci loro collegamenti a contenuti pertinenti. Che si tratti del tuo miglior contenuto o di qualcosa relativo alla pagina mancante, dipende totalmente da te. Ciò che conta è mantenerli sul tuo sito.

Scuse: fai sapere alle persone che sei dispiaciuto per il loro inconveniente. Usa l'umorismo se possibile: è il metodo migliore per incoraggiarli a dare una seconda possibilità al tuo sito.

Buon design : le persone sono deluse quando arrivano su una pagina 404 e tendono a reagire in modo eccessivo. Uno straordinario pezzo di design, oltre a contenuti accattivanti, potrebbe fargli cambiare idea. Fai del tuo meglio per creare un'eccellente pagina 404.

Come modificare una pagina 404 in WordPress

Fortunatamente, abbiamo varie opzioni per modificare una pagina 404 in WordPress. Gli utenti più esperti possono modificare il file 404.php. Questo è il file responsabile della visualizzazione della pagina di errore 404. Gli amministratori Web che preferiscono utilizzare un generatore di pagine come Elementor possono creare una pagina 404. Infine, sono disponibili alcuni plugin per creare 404 pagine per coloro che non hanno capacità di programmazione. Analizziamo tutti i modi per creare e modificare una pagina 404 in WordPress.

Modifica una pagina 404 tramite un client FTP

Una buona regola pratica è eseguire una copia di backup del tuo sito prima di modificare il codice. Non saltare mai questo passaggio: nella maggior parte dei casi, non avrai bisogno di un backup del sito, ma quando non sei preparato accadono cose brutte. Quindi fai quel backup per stare tranquillo!

Supponiamo di aver eseguito un backup completo del sito e di essere pronto per approfondire la questione. Usa il client FTP di tua scelta e connettiti al sito localhost. Cerca un file chiamato file 404.php: è il file responsabile della visualizzazione della pagina Web dell'errore 404. Di solito, i temi WordPress hanno un file 404.php dedicato, ma ad alcuni potrebbe mancare questo file. Ricontrolla se il codice del tuo tema include un file 404.php. Se il tuo tema non ha un file 404.php, dovrai crearne uno. Crea un nuovo file e copia le seguenti righe di codice:

Modello di pagina 404

 <?php /** * The template for displaying 404 pages (Not Found) * * @package WordPress * @subpackage Twenty_Thirteen * @since Twenty Thirteen 1.0 */ get_header(); ?> <div class="content-area"> <div class="site-content" role="main"> <header class="page-header"> <h1 class="page-title"><?php _e( 'Not Found', 'twentythirteen' ); ?></h1> </header> <div class="page-wrapper"> <div class="page-content"> <h2><?php _e( 'This is somewhat embarrassing, isn't it?', 'twentythirteen' ); ?></h2> <p><?php _e( 'It looks like nothing was found at this location. Maybe try a search?', 'twentythirteen' ); ?></p> <?php get_search_form(); ?> </div><!-- .page-content --> </div><!-- .page-wrapper --> </div><!-- #content --> </div><!-- #primary --> <?php get_footer(); ?>

Fonte : Creazione di una pagina di errore 404 su WordPress Codex

Questo è il codice alla base del tema 404 Pagina di Twenty Thirteen: è una pagina di base adatta per la modifica e l'utilizzo per il tuo progetto. Naturalmente, puoi dare un'occhiata ad altri temi WordPress predefiniti e controllare le loro 404 pagine. La pagina 404 del tema Twenty Thirteen chiama l'intestazione e il piè di pagina del tuo sito, quindi la pagina è in linea con lo stile del tuo sito. Indipendentemente dall'aspetto del tuo sito, la pagina di errore 404 avrà un design simile. Tuttavia, è necessario adattare il contenuto visualizzato in questa pagina. In questa fase, entra in gioco il talento del tuo creatore di contenuti.

Facoltativamente, puoi modificare il file 404.php per visualizzare il contenuto pubblicato sul tuo sito. Le opzioni sono infinite, quindi vediamo alcune potenziali modalità per migliorare l'errore di pagina 404.

  • Visualizza i titoli degli ultimi sette post- Tutto quello che devi fare è incollare questo frammento di codice nel file 404.php:
 <?php wp_get_archives( array( 'type' => 'postbypost', 'limit' => 7, 'format' => 'custom', 'before' => '<span class="my-post-title">', 'after' => '</span>, ' ) ); ?>
  • Visualizza i titoli di sette post casuali Incolla il codice seguente per visualizzare sette post casuali:
 <ul> <?php $rand_posts = get_posts( array( 'posts_per_page' => 5, 'orderby' => 'rand' ) ); if ( $rand_posts ) { foreach ( $rand_posts as $post ) : setup_postdata( $post ); ?> <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li> <?php endforeach; wp_reset_postdata(); } ?> </ul>

Aggiungi il tuo logo o un'immagine divertente (cani e gatti funzionano sempre) per far sorridere gli spettatori e darti una seconda possibilità. Quindi, testa la pagina 404 dopo aver terminato il lavoro di modifica. Per visualizzare la tua pagina 404, digita l'indirizzo del tuo sito nella barra del browser e aggiungi una stringa casuale di lettere dopo di essa. Il risultato dovrebbe assomigliare a questo:

 https://example.com/dfdfddfd

Se non funziona, è perché il server non riesce a trovare il tuo file 404.php personalizzato. In questo scenario, dovresti andare al file .htaccess del sito e incollare la seguente riga di codice:

ErrorDocument 404 /index.php?error=404

Importante : se modifichi un sito web nuovo o lanciato di recente, potrebbe non avere il file .htaccess. Non è un grosso problema: cambia i permalink del tuo sito e salva la tua operazione. Quindi, ripristina il tuo formato di permalink preferito subito dopo. In questo modo avrai generato il file .htaccess.

Modifica una pagina 404 tramite l'editor di temi (non consigliato)

Immagine di come modificare una pagina 404 in WordPress utilizzando l'editor di temi.
Modifica di una pagina 404 tramite l'editor del tema

Un numero significativo di articoli relativi alla modifica di una pagina 404 in WordPress menziona l'editor di temi come una soluzione praticabile. Non è! Sebbene sia conveniente e semplice modificare il codice del sito direttamente dalla dashboard di amministrazione di WordPress, è pericoloso e potrebbe finire in un fiasco. Per non parlare del fatto che non è affatto professionale modificare il sito mentre è online e accessibile a tutti. Inoltre, la modifica scompare una volta aggiornato il tema (a meno che non utilizzi un tema figlio).

Modifica una pagina 404 tramite Page Builders

Questo metodo è sicuro, semplice ed efficace. Probabilmente hai familiarità con i page builder come Elementor, Divi Builder, Beaver Builder, SeedProd o Themify Builder. Quale scegli non è rilevante, purché tu ne abbia una buona padronanza. Questi builder ti consentono di creare un'eccellente pagina 404 senza scrivere una singola riga di codice. Questa è la soluzione migliore se sei preoccupato di incollare frammenti di codice nei file del tuo sito.

Controlla il blog e la documentazione del tuo page builder preferito e, molto probabilmente, troverai un tutorial che spiega come creare una pagina 404. Inoltre, alcuni page builder hanno modelli dedicati per 404 pagine. Scegli un modello e personalizzalo in modo che corrisponda al tuo marchio.

Plugin WordPress di 404 pagine

Non hai molte alternative per creare una pagina 404 con un plugin dedicato. Tuttavia, alcuni plugin meritano la tua attenzione. Il loro vantaggio capitale è che non è necessario scrivere codice per creare e modificare 404 pagine. I plugin sono semplici, efficaci e leggeri.

404pagina  

Plugin 404page nel repository WP
Plugin 404page nel repository WP

Potresti essere tentato di credere che devi essere un programmatore per creare una buona pagina di errore 404. Grazie a questo plugin, tutti possono concepire un'interessante pagina di errore 404. Inoltre, il plugin 404page non è così complesso come lo sono i page builder. Ti concentri sul tuo prodotto finale: una buona pagina di errore 404.

Installa e attiva il plugin. Quindi, crea una pagina 404 come fai con il resto delle pagine del tuo sito. Dalla dashboard di amministrazione di WordPress, vai su Aspetto > Pagina di errore 404 e scegli la pagina che hai appena creato per essere la pagina di errore 404 personalizzata del tuo sito.

Questo plugin non consente il reindirizzamento delle pagine web; dice solo ai robot di ricerca che la pagina web è mancante. 404page è un progetto personale di uno sviluppatore, quindi non c'è alcuna agenzia dietro questo plugin. Tieni presente che il plug-in ha 100.000 installazioni attive e una valutazione quasi perfetta: 4,9 stelle su 5. In queste circostanze, lo sviluppatore del plug-in merita il nostro apprezzamento!

Tutti i 404 reindirizzamenti alla home page e reindirizzamento immagini interrotte  

Tutti i 404 plugin di reindirizzamento nel repository WP
Tutti i 404 plugin di reindirizzamento nel repository WP

Il nome del plugin non è abbastanza impressionante, ma è altamente suggestivo. Il plugin gestisce gli errori di pagina 404 in modo diverso rispetto all'alternativa precedente. Invece di deliziare i visitatori con una pagina 404 ben progettata, questo plugin reindirizza tutti gli errori 404 alla home page o ad un'altra pagina web. Il più grande vantaggio di questo plugin è che hai il controllo sui link interrotti sul tuo sito. Inoltre, puoi utilizzare questo plugin per reindirizzare gli utenti. Ad esempio, invece di consentire alle persone di visitare un post del blog non aggiornato, utilizza questo plug-in per indirizzarli alla versione aggiornata.

Personalizzatore Colorlib 404  

Plugin Colorlib 404 Customizer nel repository WP
Plugin Colorlib 404 Customizer nel repository WP

Questo plugin è semplice da usare e ti aiuta davvero a creare pagine 404 accattivanti. Viene fornito con 404 modelli realizzati in modo professionale che puoi personalizzare in base alle tue esigenze. Il plug-in Colorlib 404 Customizer consente di inserire pulsanti di social media, modificare il colore o l'immagine di sfondo e configurare le intestazioni del testo. Gli utenti più avanzati possono aggiungere codice CSS personalizzato. Il plugin è open-source, quindi puoi contribuire a migliorarlo.

Usa un generatore di pagine o fallo attraverso il tuo tema .

Se utilizzi già un generatore di pagine, avrai già la possibilità di personalizzare il tuo 404 tramite esso. Praticamente ogni page builder ti consente di modificare la tua pagina 404. Ecco un elenco di plugin in cui siamo certi che tu possa farlo:

● Ventilato

● Elementor

● Costruttore di castori

● Divi Builder

● Origine del sito

Se stai utilizzando un tema come OceanWP, GeneratePress o Astra, puoi farlo attraverso le loro opzioni del tema. Otterrai una pagina 404 dall'aspetto eccellente se importi contenuti demo. L'unico aspetto negativo dell'importazione di contenuti demo e dell'utilizzo di design predefiniti è che il tuo sito Web assomiglierà più o meno esattamente alla demo. Prendi, ad esempio, questo sito Web e la demo di Astra. Tutti coloro che hanno esaminato la libreria di siti iniziali di Astra riconosceranno rapidamente che i proprietari del sito Web non l'hanno creato da soli. Ciò potrebbe danneggiare la fiducia degli utenti nel tuo sito.

Il lato positivo è che Astra, OceanWP e gli altri temi con oltre 500.000 utenti estendono la loro libreria di siti iniziali ogni mese.

A voi

Ora hai un'idea chiara su come modificare una pagina 404 in WordPress. Ci sono molte soluzioni per farlo e dovresti selezionare quella adatta alle tue capacità ed esigenze. Ciò che conta è avere un'entusiasmante pagina di errore 404 per deliziare i tuoi spettatori. Il metodo e gli strumenti che utilizzi per progettare e implementare quella pagina 404 non riguardano i tuoi clienti. Non hai scuse per non avere un'eccellente pagina di errore 404! Vai al tavolo da disegno e inizia a costruire una pagina di errore personalizzata!