Quando progettiamo siti web WordPress, uno degli elementi più trascurati ma cruciali è la pagina di errore 404. Molti proprietari di siti non si rendono conto che una pagina 404 ben realizzata può essere un potente strumento per la fidelizzazione e il coinvolgimento degli utenti.
Nella nostra esperienza, una pagina 404 predefinita è un'opportunità mancata. Abbiamo visto in prima persona come una pagina 404 personalizzata possa trasformare un potenziale punto di uscita in un'occasione per guidare i visitatori verso contenuti di valore.
In questo articolo, ti mostreremo 2 metodi efficaci per migliorare il tuo modello di pagina 404 di WordPress.
Perché migliorare il tuo modello di pagina 404 in WordPress?
La maggior parte dei temi WordPress viene fornita con un modello 404 di base, inclusi i temi WordPress predefiniti.
Ad esempio, nell'immagine seguente, puoi vedere la pagina 404 di ThemeIsle Hestia.
La maggior parte di questi modelli predefiniti sono semplici e non mostrano alcun contenuto dal tuo sito. Ciò significa che chiunque atterri sulla tua pagina 404 è più propenso ad abbandonare il tuo sito web WordPress, il che aumenterà il tuo tasso di rimbalzo.
Questa è una cattiva notizia per la tua SEO WordPress e potrebbe influire sulla posizione del tuo sito nei risultati dei motori di ricerca.
Detto questo, è una buona idea creare una pagina 404 con i tuoi contenuti e il tuo marchio.
Una pagina 404 personalizzata è un ottimo modo per promuovere contenuti, come i post o i prodotti più popolari del tuo negozio online. Puoi anche includere link ai tuoi profili social, evidenziare i tuoi ultimi commenti e altro ancora.
Se stai cercando ispirazione, abbiamo raccolto i migliori esempi di design di pagine di errore 404 da cui puoi prendere spunto.
Detto questo, diamo un'occhiata a come puoi migliorare il tuo modello di pagina 404 in WordPress. Puoi utilizzare i collegamenti rapidi qui sotto per passare direttamente al metodo che desideri utilizzare:
- Metodo 1: Crea una pagina 404 personalizzata in WordPress senza codice (consigliato)
- Method 2: Create a 404 Page Using the Full Site Editor (Block Themes Only)
Metodo 1: Crea una pagina 404 personalizzata in WordPress senza codice (consigliato)
Il modo migliore per migliorare la pagina 404 del tuo sito è utilizzare SeedProd.
SeedProd è il miglior costruttore di landing page per WordPress. Ti consente di creare, modificare e personalizzare le tue pagine WordPress senza scrivere codice.
SeedProd viene fornito con oltre 300 modelli pronti all'uso, inclusi numerosi design per pagine 404. Ciò significa che puoi creare una pagina 404 dal design professionale in pochi minuti.
La prima cosa da fare è installare il plugin SeedProd. Per maggiori dettagli, consulta la nostra guida passo passo su come installare un plugin WordPress.
Nota: Esiste una versione gratuita di SeedProd che ti consente di creare bellissime pagine di manutenzione e pagine di 'prossimamente'. Tuttavia, utilizzeremo il plugin premium poiché ti consente di sostituire il template 404 integrato del tuo tema.
Dopo aver attivato il plugin, SeedProd ti chiederà la tua chiave di licenza.
Puoi trovare queste informazioni nel tuo account sul sito web di SeedProd. Dopo aver inserito la licenza, fai clic sul pulsante 'Verifica chiave'.
Una volta fatto ciò, vai su SeedProd » Pagine di destinazione. Nella sezione 'Pagina 404', fai clic su 'Imposta una pagina 404'.
Ora puoi scegliere un template per la tua pagina 404.
Per visualizzare un design, semplicemente passaci sopra il mouse e fai clic sull'icona della lente d'ingrandimento.
Quando trovi un design che ti piace, fai semplicemente clic su 'Scegli questo template'.
Stiamo usando 'Oh No 404 Page' in tutte le nostre immagini, ma puoi usare qualsiasi design desideri.
Dopo aver selezionato un modello, verrai portato all'editor drag-and-drop, dove potrai iniziare a personalizzare la pagina 404.
Sul lato sinistro dello schermo, troverai blocchi e sezioni che puoi aggiungere al tuo design. Il lato destro della pagina mostra un'anteprima in tempo reale.
La maggior parte dei modelli 404 ha già alcuni blocchi, che sono una parte fondamentale di tutti i design SeedProd.
Per personalizzare uno qualsiasi di questi blocchi, fai semplicemente clic per selezionare quel blocco nel tuo layout. Puoi quindi apportare modifiche utilizzando le impostazioni nel menu di sinistra.
Per aggiungere un nuovo blocco al tuo design, trova semplicemente il blocco nel menu di sinistra. Quindi, trascinalo sul tuo layout. Ora puoi personalizzare il blocco seguendo il processo descritto sopra.
Per iniziare, di solito vorrai aggiungere il logo del tuo sito web alla pagina 404 in modo che i visitatori sappiano che sono ancora sul tuo sito.
Per sostituire il logo SeedProd con il tuo marchio, fai semplicemente clic per selezionare il logo segnaposto nel tuo layout. Quindi, passa il mouse sopra l'immagine nel menu di sinistra.
Quando appare, fai clic sul pulsante 'Seleziona immagine'.
Questo apre la libreria multimediale di WordPress, dove puoi selezionare qualsiasi immagine o caricare un nuovo file dal tuo computer.
Molti modelli 404 mostrano anche il menu di navigazione principale del tuo sito. Se hai più menu, potresti preferire mostrarne uno diverso.
Per apportare questa modifica, fai semplicemente clic sul blocco 'Nav Menu' nel tuo modello. Puoi quindi aprire il menu a discesa 'Menu' e scegliere qualsiasi menu dall'elenco.
Per maggiori informazioni, consulta la nostra guida su come aggiungere menu di navigazione personalizzati nei temi WordPress.
Quando un visitatore arriva sulla tua pagina 404, potrebbe essere confuso su come ci è arrivato e cosa fare dopo. Detto questo, è una buona idea aggiungere del testo che spieghi che il contenuto non è stato trovato e suggerisca alcune azioni da intraprendere.
Per fare ciò, aggiungi un blocco 'Titolo' e un blocco 'Testo' al tuo design. Puoi quindi digitare il tuo messaggio nell'editor di testo nel menu a sinistra.
Successivamente, cambieremo il pulsante 'Torna alla Home' in modo che incoraggi le persone a controllare un post specifico invece di tornare semplicemente alla homepage.
Ad esempio, potresti promuovere i tuoi post più recenti o mostrare i tuoi post più commentati.
Per personalizzare il pulsante, fai semplicemente clic per selezionarlo nel layout della pagina. Nel campo 'Link', digita l'URL che desideri utilizzare.
Poiché il pulsante non rimanda più alla homepage, vorrai sostituire l'etichetta 'Torna alla Home'. Vai avanti e digita un nuovo messaggio nella casella 'Testo del pulsante'.
Una volta fatto ciò, fai clic sulla scheda 'Avanzate'. Qui puoi cambiare il colore, le dimensioni e altro del pulsante.
Questo è tutto ciò che ti serve per creare una semplice pagina 404 personalizzata. Tuttavia, ci sono molte altre funzionalità e contenuti che possono migliorare l'esperienza del visitatore, mantenere le persone coinvolte e persino aiutarti a ottenere più conversioni.
Detto questo, diamo un'occhiata ad alcune funzionalità avanzate che puoi aggiungere alla tua pagina 404.
Aggiungi i tuoi post più popolari alla tua pagina 404 di WordPress
Per iniziare, potresti voler mostrare un elenco dei tuoi post più popolari. Poiché questi articoli sono popolari, c'è una buona probabilità che i visitatori trovino qualcosa che gli piace.
Puoi creare questo elenco automaticamente utilizzando il plugin MonsterInsights. È la migliore soluzione di analisi per WordPress, utilizzata da oltre 3 milioni di siti web.
MonsterInsights può vedere quali post ricevono più visitatori e aggiungerli alla tua pagina 404. Per maggiori dettagli, consulta la nostra guida su come visualizzare i post più popolari per visualizzazioni in WordPress.
Dopo aver attivato MonsterInsights, puoi visualizzare i tuoi articoli più popolari aggiungendo uno shortcode in WordPress. Nel menu a sinistra di SeedProd, trova semplicemente il blocco 'Shortcode' e trascinalo sul tuo layout.
Ora, copia il seguente shortcode:
[monsterinsights_popular_posts_widget theme="beta"]
Successivamente, fai clic per selezionare il blocco Shortcode nell'editor di SeedProd. Ora puoi incollare il codice nel menu a sinistra.
Per impostazione predefinita, SeedProd non mostra un'anteprima dei tuoi articoli più popolari all'interno dell'editor di pagina, quindi dovrai fare clic sul pulsante 'Anteprima' nell'angolo in alto a destra per vedere lo shortcode in azione.
Se desideri vedere l'elenco degli articoli più popolari all'interno dell'editor di SeedProd, fai semplicemente clic sull'interruttore 'Mostra anteprima shortcode'.
Nello shortcode sopra, stiamo usando theme=“beta” per il nostro elenco, ma MonsterInsights ha alcuni temi diversi che puoi utilizzare.
Per vedere i diversi temi, vai su Insights » Articoli più popolari nella dashboard di WordPress e quindi fai clic su 'Widget Articoli più popolari'.
Ora puoi fare clic sui diversi temi per vedere un'anteprima.
Quando trovi un design che ti piace, aggiorna semplicemente lo shortcode in SeedProd. Ad esempio, se desideri utilizzare il tema 'Alpha', dovrai digitare:
[monsterinsights_popular_posts_widget theme="alpha"]
Mostra i tuoi prodotti WooCommerce più venduti
Se hai un negozio online, potresti voler mostrare i tuoi prodotti WooCommerce più venduti sulla pagina 404. In questo modo, la tua pagina 404 personalizzata può aiutarti a ottenere più vendite.
Nel menu a sinistra, trova il blocco Prodotti più venduti e trascinalo sul tuo layout.
SeedProd mostrerà automaticamente alcuni prodotti. Tuttavia, puoi perfezionare questo blocco selezionandolo nell'editor e quindi utilizzando le impostazioni nel menu a sinistra.
Ad esempio, puoi cambiare il numero di colonne nel blocco, aggiungere la paginazione, consentire agli acquirenti di filtrare i prodotti più venduti e altro ancora.
Per maggiori informazioni, consulta la nostra guida su come visualizzare i prodotti popolari di WooCommerce.
Nonostante il nome, puoi usare questo blocco per mostrare altri tipi di prodotti. Ad esempio, potresti mostrare prodotti in saldo o i tuoi articoli con le migliori valutazioni.
Per esaminare le diverse opzioni, apri il menu a discesa 'Tipo' e quindi scegli un'opzione dall'elenco.
Aggiungi un modulo di contatto alla tua pagina 404 di WordPress
Potresti anche voler aggiungere un modulo di contatto in modo che i visitatori possano contattarti se non trovano quello che cercano. Questo modulo offre anche alle persone un modo semplice per segnalare errori 404 in modo da poter correggere questi link interrotti e migliorare l'esperienza per i visitatori futuri.
Per maggiori informazioni, consulta la nostra guida completa su come correggere i link interrotti in WordPress.
Il modo migliore per aggiungere un modulo di contatto al tuo sito è utilizzare il plugin WPForms. È il miglior plugin per moduli di contatto per WordPress e viene fornito con un costruttore di moduli drag-and-drop.
Per maggiori dettagli, consulta la nostra guida passo passo su come creare un modulo di contatto in WordPress.
Una volta creato un modulo di contatto, puoi aggiungerlo alla tua pagina 404 utilizzando il blocco 'Modulo di contatto'. Trova semplicemente il blocco nel menu a sinistra e trascinalo sul tuo progetto.
Quindi, apri il menu a discesa 'Seleziona un modulo' e scegli il tuo modulo di contatto dall'elenco.
L'editor della pagina mostrerà ora un'anteprima del modulo di contatto.
Potresti voler aggiungere del testo che introduca il tuo modulo di contatto o incoraggi i visitatori a mettersi in contatto.
Per fare ciò, aggiungi semplicemente un blocco 'Titolo' o 'Testo' sopra il tuo modulo di contatto e poi digita il testo che desideri utilizzare.
Come pubblicare la pagina 404
Quando sei soddisfatto dell'aspetto della pagina 404, è ora di pubblicarla.
Fai semplicemente clic sulla freccia a discesa accanto a 'Salva' e poi seleziona 'Salva come modello'.
Quando richiesto, procedi a digitare un nome per il modello. Questo è solo per riferimento, quindi puoi usare quello che vuoi.
Dopodiché, fai clic su ‘Salva modello’.
Nel popup successivo, fai clic su ‘Torna all’editor di pagina’. Puoi quindi fare clic sul pulsante ‘X’ nell’angolo in alto a destra per chiudere l’editor di pagine SeedProd.
A questo punto, potresti vedere un popup che chiede se desideri pubblicare il tuo design 404. Se sei pronto, fai clic su ‘Sì, Attiva’.
Se non desideri pubblicare il modello subito, fai clic su ‘No, Chiudi’.
Dopodiché, puoi pubblicare il design in qualsiasi momento andando su SeedProd » Pagine. Qui, fai clic sull’interruttore nella sezione ‘Pagina 404’ in modo che mostri ‘Attivo’.
Per vedere la tua pagina 404 in azione, aggiungi semplicemente /404 alla fine del tuo nome di dominio.
Dopo aver pubblicato la tua pagina 404 personalizzata, è una buona idea monitorare come le persone interagiscono con quella pagina. Questo ti permette di vedere cosa funziona e cosa non funziona, in modo da poter affinare il tuo design 404 per ottenere più conversioni e interazioni.
Per saperne di più, consulta la nostra guida per principianti su come installare Google Analytics in WordPress.
Metodo 2: Crea una pagina 404 utilizzando l’editor completo del sito (solo temi a blocchi)
Se stai utilizzando un tema WordPress abilitato ai blocchi, puoi modificare la pagina 404 del tuo sito nell’editor completo del sito.
Per iniziare, vai su Aspetto » Editor nella dashboard di WordPress.
Per impostazione predefinita, l'editor del sito completo mostra il modello della home page del tuo tema.
Per modificare la pagina 404, fai clic su 'Modelli'.
Ora vedrai un elenco di tutti i modelli che compongono il tuo tema basato su blocchi, come la tua pagina del blog e la pagina degli archivi.
Fai semplicemente clic su '404'.
WordPress mostrerà ora un'anteprima del design attuale della pagina 404.
Per procedere e modificare questo modello, fai clic sulla piccola icona a forma di matita.
L'editor del sito completo funziona in modo simile all'editor di contenuti di WordPress standard.
Per aggiungere blocchi al design, fai clic sul pulsante '+'.
Ora puoi digitare il blocco che desideri aggiungere alla pagina 404.
Ad esempio, potresti voler visualizzare i tuoi post recenti. Per farlo, digita semplicemente 'Ultimi post' e poi trascina il blocco sul tuo design.
Dopo aver aggiunto un blocco, potresti volerlo personalizzare.
Puoi fare clic per selezionare il blocco nell'anteprima. Il menu a destra mostrerà quindi tutte le impostazioni che puoi utilizzare per modificare il contenuto e l'aspetto del blocco.
Le opzioni che vedi potrebbero variare a seconda del blocco che hai selezionato. Tuttavia, in genere potrai cambiare il colore di sfondo, il colore del testo e cambiare la dimensione del carattere.
Potresti anche voler visualizzare i post recenti come menu a discesa, se necessario.
Ora puoi continuare ad aggiungere blocchi al tuo design e a perfezionarli seguendo lo stesso processo descritto sopra. Potresti anche voler disporre i tuoi widget di WordPress in colonne o utilizzare pattern di blocchi di WordPress per creare più velocemente una pagina 404 personalizzata.
Quando sarai soddisfatto dell'aspetto della pagina 404, fai clic su 'Salva' per renderla attiva.
Ora, se aggiungi /404 alla fine del nome di dominio del tuo sito web, vedrai la pagina 404 personalizzata in azione.
Quando dovresti reindirizzare le pagine 404?
Una delle cause più comuni degli errori 404 è quando il visitatore commette un errore durante l'inserimento dell'URL.
In questo caso, di solito non è necessario reindirizzare l'utente a un'altra pagina. Ma ti consigliamo di seguire le best practice che ti abbiamo mostrato per rimetterli in carreggiata.
Detto questo, se non hai tempo di creare un modello di pagina 404 personalizzato, potresti voler reindirizzare gli utenti alla homepage nel frattempo. In questo modo, puoi comunque mantenere gli utenti sul tuo sito web.
Oltre a ciò, suggeriamo vivamente anche di tracciare e reindirizzare gli errori 404. Facendo ciò, puoi scoprire quali link gli utenti non sono riusciti ad accedere e puoi reindirizzarli alle pagine più pertinenti.
Di conseguenza, puoi massimizzare l'opportunità di aumentare le visualizzazioni di pagina e ridurre i tassi di rimbalzo. Inoltre, puoi mantenere i backlink che sono stati collegati a queste pagine per mantenere la tua autorità di dominio.
Il plugin All in One SEO ha un utile registro degli errori 404 e una funzione di reindirizzamento che puoi utilizzare. Non hai bisogno di alcuna conoscenza tecnica per usarlo correttamente poiché è abbastanza user-friendly fin da subito.
Se desideri altre raccomandazioni di plugin, consulta il nostro elenco dei migliori plugin gratuiti per reindirizzare le pagine 404 di WordPress.
Tutorial video
Speriamo che questo articolo ti abbia aiutato a migliorare il template della tua pagina 404 in WordPress. Potresti anche voler consultare le nostre scelte di esperti dei migliori plugin per i post più popolari di WordPress e il nostro articolo sull'anatomia di una landing page ad alta conversione.
Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per tutorial video su WordPress. Puoi anche trovarci su Twitter e Facebook.
Olaf
La pagina 404 è un mix di divertimento e sfida per me. Cerco di progettarla in modo che non solo si adatti allo stile del sito web, ma porti anche un po' di umorismo in una situazione altrimenti frustrante in cui il contenuto semplicemente non esiste più e non tornerà. In quel momento, l'utente è ovviamente frustrato e pronto a cercare altrove. Come li trattieni? Questo è l'obiettivo secondario di una pagina 404. È interessante sperimentare diversi modi per mantenere l'utente ed evitare di aumentare inutilmente il tasso di rimbalzo. Ci sono parecchi metodi, e quello più efficace sembra essere offrire contenuti alternativi che potrebbero interessarli, in modo che non se ne vadano immediatamente.
Quello che mi piace di più, però, è ideare design e concetti umoristici per far sorridere l'utente, anche in una situazione così spiacevole. Penso che questo aiuti a prevenire la frustrazione dell'utente e aiuti a costruire un buon rapporto fin dall'inizio. E soprattutto, se riesci a far sorridere qualcuno, puoi facilmente trasformare uno svantaggio in un vantaggio. Ecco perché amo davvero creare pagine 404 e trovare idee per esse.
Jiří Vaněk
Avere una pagina 404 personalizzata invece di quella predefinita offerta da WordPress è molto importante per me per diverse ragioni. Ha un aspetto migliore grazie a grafiche personalizzate, che possono persino alleggerire la frustrazione dell'utente dal non trovare ciò che stava cercando. Inoltre, può indirizzare l'utente verso un altro articolo simile, mantenendolo sul sito molto più a lungo di una tipica e noiosa pagina 404 fornita da WordPress. Personalmente, ero solito creare pagine 404 in Elementor, ma il tuo esempio in SeedProd è molto stimolante. Vorrei creare una pagina 404 su un sito web in cui sto già utilizzando SeedProd, e questa è un'ottima fonte di ispirazione e aiuto per me.
Tracy A
Grazie per l'articolo, questo è un buon inizio. Se possibile, ci sono altri metodi possibili se non si è alfabetizzati al codice? Sto cercando di ridurre il numero di plugin poiché installarli sembra rallentare alcuni siti web.
Supporto WPBeginner
Our plugin recommendation is what we recommend for users who do not have coding knowledge. For your plugin concerns, we would recommend taking a look at our article below that covers why this should not be a concern
https://www.wpbeginner.com/opinion/how-many-wordpress-plugins-should-you-install-on-your-site/
Amministratore
Dennis Muthomi
Dopo aver letto questo, penso che sia ora di migliorare la mia semplice pagina 404 aggiungendo link ad alcuni dei miei articoli più popolari.
In questo modo, i visitatori che capitano sulla mia pagina 404 avranno contenuti utili con cui interagire e AGIRANNO, invece di vedere solo un messaggio di errore.
Grazie per questo!
Jiří Vaněk
Questa è onestamente un'ottima idea, e l'ho adottata anch'io. Stavo pensando a come mantenere le persone sul sito che cercavano qualcosa che potrei aver rimosso perché obsoleto. Ecco perché ho inserito un widget sulla mia pagina 404 che mostra gli articoli più letti, e poi ho monitorato se gli utenti cliccavano su quei link. E sì, lo hanno fatto. Grazie a questo, la pagina 404 non solo svolge il suo scopo informativo facendo sapere agli utenti che il contenuto non è più disponibile, ma aiuta anche a mantenere le persone sul sito offrendo loro altri contenuti che potrebbero interessare. Non è una soluzione perfetta, ma è sicuramente qualcosa che aiuta.
Mrteesurez
Per quanto riguarda il reindirizzamento degli utenti.
Hai condiviso la best practice suggerendo di tracciare e reindirizzare gli errori 404.
Se si è in grado di trovare il link particolare che porta all'errore 404, sarà sicuramente utile sia per creare contenuti attorno ad esso sia per reindirizzare gli utenti a una pagina correlata che potrebbe essere pertinente per loro.
Moinuddin Waheed
Grazie per aver fornito le opzioni di design per creare una pagina di errore 404 intuitiva e innovativa.
Ho visto buone pagine di errore 404 e non ero sicuro che crearle fosse così facile.
Seedprod offre così tante opzioni da modificare sulla pagina di errore 404 e renderla il più intuitiva e innovativa possibile in modo che la brutta esperienza degli utenti si trasformi in una buona esperienza.
Pramendra Singh
Grazie signore. Questo è quello che cercavo da tempo. Ottimo post.
Joe Wocoski
Ciao,
Ho appena letto della pagina 404, ma non sono esperto di codice. Il tuo articolo sembra complicato e i post popolari non mi entusiasmano.
Quale sarebbe un semplice widget che posso usare per visualizzare un singolo elenco delle mie schede principali nella pagina 404 sotto la ricerca.
Hai un widget per rimandare i lettori alla mia pagina principale del blog o alle mie altre 9 schede principali?
Grazie mille
Joe Wocoski
arman
Questo codice mostra le intestazioni dei post ma voglio mostrare anche il contenuto dei post. Grazie in anticipo
Staff di WPBeginner
Prova ad aggiornare la struttura dei tuoi permalink visitando Impostazioni -> Permalink. Fai semplicemente clic sul pulsante Salva modifiche senza apportare alcuna modifica alla tua struttura dei permalink.
Su Boit Quoi Ce Soir
Ciao, articolo molto bello, grazie! Tuttavia qualcosa semplicemente non funziona. Quando chiamo su pagina 404.php (una volta attivato il plugin), semplicemente non viene visualizzato. Qualche idea sul perché sta succedendo?
Ali Sajjad
Grazie per questo post utile, voglio sapere come posso piegare il mio primo post dall'intestazione proprio come una curva con un'ombra?
CANALWP
Grazie per questo fantastico articolo. Mi stavo chiedendo come posso aggiungere la mia categoria a questa pagina e anche le immagini. Grazie.
Cheri- CreationScience4kids
Thanks! I’d used wp.com for 2 years before moving to selfhosting. It was exciting to take out all the dates on my articles, but then I started realizing my most popular page by far was the 404! I did the work to use the redirect plugin (also great for posts with rotten original headlines), but haven’t done it for all 400+.
The email alert will be a relief and the most recent/popular/etc posts idea is great.