Come creare una home page personalizzata su WordPress
Pubblicato: 2023-01-25Vuoi creare una home page personalizzata in WordPress?
Per impostazione predefinita, WordPress mostra i tuoi ultimi post del blog sulla home page. Tuttavia, spesso puoi creare una prima impressione migliore progettando una home page personalizzata che evidenzi i contenuti, i prodotti, i servizi e altro ancora più popolari del tuo sito.
In questo articolo, ti mostreremo come creare facilmente una home page personalizzata in WordPress.
Che cos'è una home page?
Una home page è la prima pagina che i visitatori vedono quando digitano il tuo nome di dominio. Per molte persone, questa home page è la loro introduzione alla tua attività, blog o sito web.
Una buona home page farà desiderare ai visitatori di saperne di più sul tuo sito Web WordPress. Fornirà inoltre un facile accesso a collegamenti, barre di ricerca, menu e qualsiasi altra cosa che possa aiutare i visitatori a trovare contenuti interessanti.
Per impostazione predefinita, WordPress mostra i tuoi ultimi post del blog sulla home page.
Questo può essere adatto per blog personali o blogger per hobby. Tuttavia, molti blog e siti Web WordPress possono trarre vantaggio dalla sostituzione della home page standard con una home page personalizzata.
La buona notizia è che WordPress semplifica la visualizzazione di una pagina personalizzata come pagina iniziale, anziché l'elenco predefinito di post recenti.
Selezione di una pagina personalizzata da utilizzare come home page in WordPress
In questa guida, ti mostreremo alcuni modi diversi per creare una home page personalizzata. Tuttavia, in seguito, dovrai far sapere a WordPress che dovrebbe utilizzare questa pagina come home page.
Per farlo, vai semplicemente su Impostazioni »Lettura nella dashboard di WordPress.
Qui, scorri fino a "Impostazioni della tua home page" e seleziona "Una pagina statica".
Ora puoi aprire il menu a discesa "Pagina iniziale" e scegliere la pagina che desideri utilizzare come nuova pagina iniziale.
Quindi, scorri semplicemente fino alla parte inferiore dello schermo e fai clic su "Salva modifiche". Ora puoi visitare il tuo sito per vedere dal vivo la nuova home page personalizzata.
Se hai un blog, assicurati di creare una pagina del blog separata per visualizzare i tuoi post. In caso contrario, i visitatori avranno difficoltà a trovare i tuoi ultimi blog.
Detto questo, vediamo come progettare una home page personalizzata in WordPress. Utilizza semplicemente i collegamenti rapidi di seguito per passare direttamente al metodo che desideri utilizzare.
Metodo 1. Creare un modello di home page personalizzato utilizzando l'editor blocchi
Se utilizzi un tema a blocchi, puoi progettare un modello di home page personalizzato utilizzando l'editor completo del sito.
Questo metodo non funziona con tutti i temi, quindi se non utilizzi un tema WordPress basato su blocchi, ti consigliamo di utilizzare invece un page builder come SeedProd o Beaver Builder.
Per iniziare, crea semplicemente una nuova pagina o apri una pagina esistente che desideri utilizzare come home page. Quindi, fai clic sulla scheda "Pagina" nel menu a destra e fai clic per espandere la sezione "Modello", se non è già aperta.
WordPress ora mostrerà quale modello sta attualmente utilizzando questa pagina.
Per creare un modello di home page personalizzato, fai clic sul link "Nuovo".
Nel popup, dai un nome al tuo modello. Il nome è solo per riferimento, quindi puoi usare tutto ciò che desideri.
Successivamente, vai avanti e fai clic su "Crea" per avviare l'editor completo del sito.
L'editor di modelli funziona in modo simile all'editor di blocchi standard di WordPress.
Per aggiungere blocchi alla tua home page personalizzata, fai clic sul pulsante blu "+". Puoi quindi trascinare e rilasciare qualsiasi blocco sul tuo layout.
Dal momento che stiamo creando una home page personalizzata, in genere vorrai iniziare aggiungendo un'immagine grande come il logo o il banner del tuo sito web.
Per fare ciò, trova semplicemente il blocco "Immagine" nel menu a sinistra e poi aggiungilo al tuo layout usando il trascinamento della selezione.
Ora puoi scegliere un'immagine dalla libreria multimediale di WordPress o caricare un nuovo file dal tuo computer.
Per ottenere più coinvolgimento, potresti voler mostrare i commenti recenti sulla tua home page aggiungendo un blocco "Ultimi commenti".
Per ulteriori informazioni, consulta la nostra guida su come mostrare i commenti sulla home page del tuo tema WordPress.
Una buona home page aiuta i visitatori a trovare contenuti interessanti. Detto questo, è una buona idea aggiungere un blocco "Navigazione" alla tua home page personalizzata.
Per saperne di più, consulta la nostra guida passo-passo su come aggiungere menu di navigazione personalizzati nei temi di WordPress.
Dopo aver aggiunto un blocco, assicurati di fare clic per selezionarlo nel tuo layout. È quindi possibile configurare il blocco utilizzando le impostazioni nel menu a destra e i pulsanti nella mini barra degli strumenti.
Per creare la tua home page personalizzata, continua semplicemente ad aggiungere più blocchi e quindi configurali utilizzando le impostazioni complete dell'editor del sito.
Ad esempio, potresti voler aggiungere blocchi come Ultimi post, Ricerca, Icone social, Tag cloud e altro.
Quando sei soddisfatto dell'aspetto del modello, fai clic sul pulsante "Pubblica".
La pagina creata in precedenza ora utilizzerà il nuovo modello di home page. Ora puoi dire a WordPress di utilizzare questa pagina come home page seguendo la procedura sopra descritta.
Metodo 2. Crea una home page personalizzata in WordPress utilizzando un Page Builder (consigliato)
L'editor basato su blocchi di WordPress ti consente di creare una home page personalizzata utilizzando gli strumenti con cui hai già familiarità. Tuttavia, non funziona con tutti i temi ed è limitato in termini di flessibilità e funzionalità.
Se desideri creare una home page completamente personalizzata che funzioni con qualsiasi tema WordPress, avrai bisogno di un plug-in per la creazione di pagine.
Per questo metodo, useremo SeedProd. È il miglior plug-in per la creazione di pagine sul mercato e ti consente di creare una home page personalizzata utilizzando un semplice editor drag-and-drop.
Inoltre viene fornito con molti modelli progettati in modo professionale e blocchi già pronti che puoi utilizzare sulla tua home page.
Nota: è disponibile una versione gratuita di SeedProd su WordPress.org, ma utilizzeremo la versione Pro poiché ha più modelli, blocchi e funzionalità.
La prima cosa che devi fare è installare e attivare il plugin SeedProd. Per maggiori dettagli, consulta la nostra guida passo passo su come installare un plugin per WordPress.
Dopo l'attivazione, è necessario inserire la chiave di licenza.
Puoi trovare queste informazioni sotto il tuo account sul sito web di SeedProd. Dopo aver inserito la chiave di licenza, vai avanti e fai clic sul pulsante "Verifica chiave".
Successivamente, devi visitare SeedProd »Pagine e fare clic sul pulsante "Aggiungi nuova pagina di destinazione".
Successivamente, è il momento di scegliere un modello per la tua home page personalizzata. SeedProd ha molti modelli dal design professionale che puoi personalizzare in base alle esigenze del tuo sito web.
Per selezionare un modello, passaci sopra con il mouse e fai clic sull'icona "Segno di spunta".
Utilizziamo il modello "Juicy Sales Page" in tutte le nostre immagini, ma puoi utilizzare qualsiasi design.
Successivamente, vai avanti e digita un nome per la home page personalizzata. SeedProd creerà automaticamente un URL basato sul titolo della pagina, ma puoi cambiare questo URL in qualsiasi cosa tu voglia.
Quando sei soddisfatto delle informazioni che hai inserito, fai clic sul pulsante "Salva e inizia a modificare la pagina".
Successivamente, verrai indirizzato al generatore di pagine drag-and-drop di SeedProd, dove potrai personalizzare il tuo modello.
L'editor SeedProd mostra un'anteprima dal vivo del tuo progetto a destra e alcune impostazioni del blocco a sinistra.
Il menu a sinistra ha anche blocchi che puoi trascinare sul tuo layout.
Ad esempio, puoi trascinare e rilasciare blocchi standard come pulsanti e immagini o utilizzare blocchi avanzati come conto alla rovescia, modulo di contatto, pulsanti di condivisione social e altro.
Per personalizzare qualsiasi blocco, fai semplicemente clic per selezionarlo nel tuo layout.
Il menu a sinistra ora mostrerà tutte le impostazioni che puoi utilizzare per configurare quel blocco. Puoi anche cambiare i colori di sfondo, aggiungere immagini di sfondo o modificare la combinazione di colori e i caratteri per adattarli meglio al tuo marchio.
Per iniziare, ti consigliamo di sostituire qualsiasi immagine segnaposto con le tue foto o il logo personalizzato. Per fare ciò, fai semplicemente clic per selezionare qualsiasi blocco immagine nell'anteprima dal vivo.
Nel menu a sinistra, fai clic sul pulsante "Seleziona immagine".
Ora puoi scegliere un'immagine dalla libreria multimediale di WordPress o caricare un nuovo file dal tuo computer.
SeedProd viene fornito anche con "Sezioni", che sono raccolte di blocchi che vengono spesso utilizzati insieme. Ad esempio, SeedProd ha un'intestazione, un'immagine dell'eroe, un invito all'azione, testimonianze, modulo di contatto, domande frequenti, funzionalità, sezioni a piè di pagina e altro ancora. Questi possono aiutarti a creare una home page personalizzata, velocemente.
Per consultare le diverse sezioni, è sufficiente fare clic sulla scheda "Sezioni". Per visualizzare in anteprima qualsiasi sezione, passaci sopra con il mouse e fai clic sull'icona della lente di ingrandimento.
Per aggiungere la sezione al tuo progetto, fai semplicemente clic su "Scegli questa sezione".
Questo aggiungerà la sezione in fondo alla tua home page.
Puoi spostare sezioni e blocchi all'interno del layout utilizzando il trascinamento della selezione.
Quando sei soddisfatto dell'aspetto della home page, non dimenticare di fare clic sul pulsante "Salva" per memorizzare le modifiche.
SeedProd rende semplicissimo connettere la tua home page a popolari servizi di email marketing come Constant Contact o Mailchimp.
Per fare ciò, fai semplicemente clic sulla scheda "Connetti" e seleziona il tuo provider di servizi di posta elettronica.
SeedProd ora ti mostrerà come integrare la home page con il tuo provider di posta elettronica.
Se il tuo provider non è elencato, non preoccuparti. SeedProd funziona con Zapier che funge da ponte tra SeedProd e oltre 3000+ altre app.
Dopo averlo fatto, sei pronto per pubblicare la tua home page personalizzata. Basta fare clic sulla scheda "Impostazioni pagina".
Ci sono più opzioni nella scheda Impostazioni pagina che potresti voler esaminare. Ad esempio, puoi modificare le impostazioni SEO, modificare il titolo della pagina e connettere un dominio personalizzato.
Quando sei soddisfatto di come è impostata la pagina, vai avanti e seleziona la scheda "Generale".
Ora puoi fare clic sull'interruttore "Stato pagina" per modificarlo da "Bozza" a "Pubblica".
Ora devi semplicemente andare su Impostazioni »Lettura e impostare questa pagina come nuova home page personalizzata.
Metodo 3. Crea manualmente una home page personalizzata in WordPress (codifica richiesta)
Puoi anche creare una home page personalizzata utilizzando il codice. Tuttavia, questo metodo è complicato e gli errori di codifica possono causare tutti i tipi di errori comuni di WordPress.
Detto questo, non consigliamo questo metodo per i principianti.
Il tuo tema WordPress è composto da molti file diversi. Alcuni di questi file sono chiamati modelli e controllano l'aspetto delle diverse aree del tuo sito web. Per ulteriori informazioni, consulta il nostro foglio informativo sulla gerarchia dei modelli di WordPress.
Uno di questi modelli si chiama front-page.php.
Se il tuo tema ha questo modello, WordPress lo utilizzerà automaticamente per mostrare la tua home page. Ciò significa che puoi creare una home page personalizzata modificando questo file o sostituendolo con un nuovo file.
Per iniziare, avrai bisogno di un client FTP come FileZilla, oppure puoi utilizzare il file manager fornito dal tuo provider di hosting WordPress.
Se è la prima volta che utilizzi FTP, puoi consultare la nostra guida completa su come connettersi al tuo sito tramite FTP.
Dopo esserti connesso al server, vai su /wp-content/themes/ e quindi apri la cartella per il tuo attuale tema WordPress.
Se questa cartella ha già un file front-page.php, puoi andare avanti e aprire quel file in qualsiasi editor di testo, come Blocco note. È quindi possibile apportare le modifiche desiderate modificando il codice.
Se il tuo tema non ha un file front-page.php, puoi creare un nuovo file con il nome front-page.php.
Dopodiché, devi solo caricare front-page.php nella cartella del tuo tema corrente sul tuo account di hosting WordPress.
Non appena carichi questo file, WordPress inizierà a usarlo per visualizzare la tua home page. Tuttavia, poiché il file è completamente vuoto, vedrai una pagina vuota come pagina iniziale.
Per risolvere questo problema, basta aprire il file in un'app di editor di testo e iniziare ad aggiungere codice HTML.
Se inizi con un file vuoto, puoi risparmiare un po' di tempo utilizzando il codice e i modelli esistenti nel tuo tema WordPress.
Ad esempio, di solito ha senso includere l'intestazione e il piè di pagina del tema.
Nel seguente codice di esempio, abbiamo rimosso il contenuto e le barre laterali durante il recupero dell'intestazione e dei modelli di navigazione dal tema.
<?php /*
This page is used to display the static frontpage.
*/
// Fetch theme header template
get_header(); ?>
<div id="primary" <?php astra_primary_class(); ?>>
<div class="custom-homepage-container">
You custom homepage code goes here
</div>
</div><!-- #primary -->
//Fetch the theme footer template
<?php get_footer(); ?>
Suggerimenti per creare una home page personalizzata efficace in WordPress
La home page è la pagina più importante del tuo sito. Le persone visiteranno questa pagina per saperne di più sulla tua attività, prodotti e servizi.
Per aiutare i visitatori a trovare ciò che stanno cercando, ti consigliamo di mantenere il design della tua home page il più semplice possibile ed evitare qualsiasi disordine.
È anche una buona idea posizionare i contenuti più importanti nella parte superiore della pagina, in modo che siano la prima cosa che i visitatori vedono.
Prima di progettare la tua pagina, può essere utile annotare gli obiettivi che desideri raggiungere. Puoi quindi progettare ogni parte della home page per aiutarti a raggiungere questo chiaro obiettivo.
Molte aziende e blog vogliono convertire i visitatori in clienti. Per raggiungere questo obiettivo, ti consigliamo di aggiungere OptinMonster alla tua home page personalizzata.
OptinMonster è il miglior plug-in popup di WordPress e software di lead generation. Ti consente di creare tutti i tipi di popup, barre mobili, tappetini di benvenuto a schermo intero, caselle di scorrimento scorrevoli, moduli di lead personalizzati in linea, spin gamified per vincere optin e altro ancora.
Successivamente, ti consigliamo di monitorare il rendimento della tua home page personalizzata. Puoi quindi utilizzare queste informazioni per perfezionare il design della pagina e ottenere ancora più conversioni.
MonsterInsights è il miglior plugin per Google Analytics. Ti consente di installare facilmente Google Analytics in WordPress e ti mostra report utili direttamente nella dashboard di WordPress.
La parte migliore dell'utilizzo di MonsterInsights è che puoi aggiungere il codice di monitoraggio di Google Analytics senza modificare il codice o assumere uno sviluppatore. Inoltre, ha una funzione Dual Tracking, che semplifica il passaggio a Google Analytics 4.
Dovresti anche consentire ai visitatori e ai potenziali clienti di contattarti facilmente. Per questo, consigliamo WPForms, il miglior plug-in per moduli WordPress sul mercato.
Infine, è una buona idea guardare i tuoi concorrenti e altri siti popolari nel tuo settore o nicchia. Anche se non è mai una buona idea copiare, puoi usarli come ispirazione o imparare le migliori pratiche che puoi poi applicare al layout della tua home page.
Speriamo che questo articolo ti abbia aiutato a creare facilmente una home page personalizzata in WordPress. Potresti anche voler vedere i nostri comprovati suggerimenti per aumentare il traffico del tuo blog e la nostra selezione esperta dei migliori plug-in di prova sociale per WordPress.
Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per i video tutorial di WordPress. Puoi trovarci anche su Twitter e Facebook.