Come personalizzare l’homepage di un blog WordPress

Riprendo un articolo che ho scritto un po’ di tempo fa perché mi rendo conto che è un po’ superato. L’homepage, manco a dirlo, è una pagina importantissima per il nostro blog: di default WordPress la riempie con gli ultimi articoli in ordine cronologico inverso; ma se volessimo esplorare altre possibilità? Grazie alle novità che WordPress ha introdotto nelle ultime versioni è più semplice ottenere determinati risultati e rendere la nostra homepage più adatta alle nostre esigenze. Già che ho deciso di aggiornare l’articolo, ne ho anche approfittato per ampliarlo e renderlo un po’ più chiaro (almeno spero).

Gli ultimi articoli in ordine cronologico inverso

Di default WordPress riempie la nostra homepage con gli articoli in ordine cronologico inverso; possiamo scegliere di:

  • lasciarli per intero (opzione di default);
  • “tagliarli” ad un certo punto con il tag “More“: mentre stiamo scrivendo un articolo nell’editor, premendo il pulsante “More” interrompiamo l’articolo con la classica linea tratteggiata, che ci indica appunto che l’articolo verrà visualizzato solo fino a quel punto nella homepage.

Possiamo anche scegliere il numero di articoli che appare nella homepage andando in Impostazioni>Lettura e completando il campo “le pagine del blog visualizzano al massimo ___ articoli più recenti”.

Da qualche tempo possiamo anche scegliere di mostrare in homepage un’immagine per ogni articolo, anche se l’articolo in sé non ha un’immagine, oppure non si vuole che appaia la prima immagine dell’articolo, ma un’altra. E’ sufficiente caricare l’immagine scelta andando in “Immagine in evidenza” (vedi immagine):

Impostare una pagina statica come Homepage

E’ l’opzione ideale quando, ad esempio, si vuole che nella Homepage del nostro blog sia presente un messaggio di benvenuto, una presentazione, o anche delle spiegazioni per aiutare i navigatori a capire come funziona il blog. Creare una pagina statica in WordPress è molto facile:

  1. Crea una nuova pagina (Pagine>Aggiungi nuova): scrivi il titolo, il contenuto, e poi pubblicala.
  2. In Impostazioni>Lettura, alla voce “Visualizzazione pagina iniziale” , spunta “Una pagina statica” e poi seleziona, dal menu a tendina vicino a “Pagina iniziale”, il titolo della pagina appena creata.

Questa soluzione è perfetta, appunto, per mostrare in homepage sempre lo stesso contenuto, o comunque del contenuto che non cambia molto spesso. Tuttavia, se il tuo tema lo permette, potresti anche riuscire ad inserire lo stesso del contenuto dinamico in Homepage: ad esempio, potresti proporre un testo di benvenuto e poi inserire gli ultimi articoli, o i commenti, o delle immagini, ecc., tramite degli appositi plugin o widget.

Pagina dinamica come Homepage

Questa è una soluzione un po’ più “impegnativa” da realizzare, perché prevede una conoscenza perlomeno elementare del codice php e dei css; però è un sistema che permette di creare la tua homepage esattamente su misura, con i contenuti e lo stile che vuoi tu. Questa soluzione va bene quando si hanno esigenze di personalizzazione molto particolari. Se non te la senti di invischiarti con i codici, puoi cercare qualche tema Worpdress gratis o a pagamento che si adatti alle tue esigenze, o se proprio non trovi niente puoi chiedere l’aiuto di un professionista.

Per creare una homepage dinamica è necessario assegnarle un template; ecco come fare (è lo stesso procedimento che avevo già scritto nell’articolo precedente; in questo caso non ci sono cambiamenti):

  1. Vai nella cartella del tema wordpress che stai usando.
  2. Apri il file index.php e salvalo col nome home.php.
  3. Apri index.php e aggiungi questo codice proprio in testa al file:
    <?php
    /*
    Template Name: index.php
    */
    ?>
  4. Entra in WordPress come amministratore e crea una nuova pagina, a cui darai come titolo, ad esempio ‘Homepage’. Non scrivere nulla come contenuto della pagina, lasciala bianca. Nella sezione Attributi>Template, che trovi a destra, vicino alla pagina che stai creando, seleziona dal menu a tendina la voce: index.php. In questo modo hai assegnato il template index.php alla pagina che sarà l’Homepage del tuo blog. Pubblica la pagina appena creata.
  5. Vai in Impostazioni>Lettura: da ‘Visualizza pagina iniziale’ scegli ‘una pagina statica’ e quindi seleziona dal menu a tendina la pagina con il titolo ‘Homepage’.
  6. A questo punto non ti resta che andare a modificare come vuoi il file index.php, perché è questo che determina l’aspetto della tua Homepage. Puoi inserire tutto ciò che desideri per personalizzare la pagina secondo le tue esigenze.

Ricreare una pagina per gli articoli in ordine cronologico inverso

Sia che tu abbia creato un’homepage statica, sia che tu abbia creato un’homepage dinamica, ora hai il problema che ti è sparita la pagina con gli ultimi articoli del blog. Ma c’è modo di ricreare quella pagina.

Se vuoi (come credo) conservare una pagina del tuo blog che mostri gli articoli in ordine cronologico inverso, devi creare una nuova pagina e assegnarle un titolo (ad esempio “Articoli”) e pubblicarla; non occorre che tu scriva niente come contenuto della pagina, basta solo il titolo. Dopodiché, sempre in Impostazioni>Lettura, alla voce “Visualizzazione pagina iniziale” , seleziona dal menu a tendina “Pagina articoli” il titolo della pagina appena creata.

Così facendo avrai una Homepage personalizzata, statica o dinamica ; e poi avrai una pagina “Articoli” (o altro titolo a tua scelta) che mostrerà gli ultimi articoli del tuo blog.

Prima, come avevo scritto nell’articolo precedente, se si creava un’homepage dinamica, ricreare la pagina degli ultimi articoli era più difficile e bisognava adottare degli accorgimenti particolari; ora invece si può fare col metodo, diciamo, standard; WordPress si arrangia da solo.

26 thoughts on “Come personalizzare l’homepage di un blog WordPress

  1. Pingback: [Codice Wordpress] Creare un'homepage da personalizzare secondo le proprie esigenze | NoSatisPassion

  2. Pingback: nosatispassion - Come personalizzare l’homepage di un blog WordPress - AlterVista - Webpedia

  3. Ho aperto da poco il mio blog e mi stavo scervellando su come fare per avere una home fissa. grazie a te finalmente lo so!grazie mille

  4. @elo: Grazie a te, Elo, ho visto il tuo blog e mi sembra che la tua Homepage sia perfetta. Ciao e in bocca al lupo! :)

  5. grazie elisa,
    purtroppo ora il mio blog è scomparso…volevo inserire Google Analytics, ma devo aver incollato il codice in un posto sbagliato e ora il blog si è volatilizzato!Mi appare solo la scritta “Parse error: syntax error, unexpected ‘<' in /membri/ioacquistonline/blog/wp-content/themes/sunset-theme/functions.php on line 6", spero di riuscire a recuperarlo!

  6. Ciao Elisa, scusa ma sono nuovo del mondo wordpress e ti vorrei chiedere una cosa:
    Nel mio blog come puoi vedere ho creato altre pagine come ad esempio “Ciao Tallin” ecco volevo sapere all’interno di questa pagina, come posso aggiungere diversi post? Me ne fa inserire solo uno :S . Ho cercato di seguire le tue indicazioni ma non ci sono riuscito. Io comunque ho un mac se la cosa può essere influente. Spero davvero tu possa essermi d’aiuto!

  7. @Daniele: Ciao Daniele, non so se ho ben capito cosa intendi quando dici che vuoi inserire diversi post all’interno della stessa pagina. Se, ad esempio, vorresti creare una pagina tipo questa:
    http://nosatispassion.altervista.org/tag/fotografia/
    Allora vedi che una pagina di questo tipo non è una pagina che tu crei andando nella bacheca e selezionando ‘Pagine>Aggiungi nuova’. Quella pagina si crea, per così dire, ‘da sola’ nel momento in cui tu crei una categoria (o un tag) e decidi di includere i tuoi post in quella categoria (o tag).
    Nel caso in questione, io ho creato il tag ‘fotografia’, e poi quando scrivo il post aggiungo il tag ‘fotografia’, e quel post si ‘inserisce’ automaticamente all’interno della pagina col tag ‘fotografia’, che è una pagina che indicizza tutti i post con il tag ‘fotografia’.
    Altrimenti, un’altra idea per raggiungere un risultato simile potrebbe essere creare la pagina e inserire i link ‘manualmente’ verso altri post già scritti.
    Non so se quello che dico ti è chiaro… Magari potrebbe esserti utile, visto che sei all’inizio, leggere la mia Guida a WordPress per principianti.

  8. ciao, ho una domanda sulla creazione di una pagina dinamica. Te dici di aprire il fileindex.php e salvarlo col nome home.php, quindi in pratica cancelli il file index.php giusto? o comunque va fatta una copia?

    Poi dici di aggiungere questo codice nel file index.php che però è diventato home.php..

    non ho le idee molto chiare, puoi aiutarmi?

  9. @Ste: Ciao Ste, mi rendo conto che quella parte potrebbe risultare poco chiara. Quello che si deve fare è creare una copia di ‘index.php’, e salvarla col nome ‘home.php’; dopodiché si va a modificare il file ‘index.php’ aggiungendo il codice che ho riportato (home.php, invece, rimane com’è).
    Spero di aver chiarito il tuo dubbio! ;)

  10. @ Ste: Ciao..il tuo blog è fantastico e spero tu possa aiutarmi! Da poco tempo mi hanno affidato in gestione un sito già esistente generato con WordPress. E’ facile da usare, ma vorrei sapere come cambiare la risoluzione della pagina d’avvio per renderla più piccola…come da richiesta del mio capo! Ti prego, rispndimi presto!! Grz 1000!

  11. Ciao Elisa…per favore mi potresti aiutare?
    Devo rimpicciolire la homepage di un sitoWordPress che ho da poco in gestione. So che bisogna modificare il file index.php…ma non so cosa dovrei scrivere. Per favore rispondimi. E’molto importante che io modifichi la home! Grazie 1000!!!

  12. @Diana: ciao Diana, purtroppo non è così semplice: non basta modificare il file index.php. Per fare quello che vuole il tuo capo, bisogna anche mettere mano ai css. Quello che bisogna fare potrebbe anche essere un lavoro piuttosto complesso, dipende da quanto è complessa la grafica della pagina.
    Per fare prima, ti consiglio di cambiare il tema: scegline un altro che abbia le dimensioni corrette.
    Il tuo capo se ne intende di internet e siti web? Se non è molto esperto, il problema potrebbe dipendere anche da impostazioni del suo dispositivo….! =)

  13. Ciao, chiedo il tuo aiuto perchè sto cercando in tutti i modi di inserire un’immagine associata ad un link (in pratica una sorta di banner) nella homepage di un sito gestito con wordpress. Devo inserirla in alto, praticamente subito sotto l’header menu, sto tentando in tutti i modi, modificando il file home.php, index.php, creando un nuovo articolo (ma poi non so dove inserirlo) insomma le sto tentando tutte ma sono alle prime armi e non so che altro fare. E’ abbastanza importante perchè si tratta del sito aziendale, puoi darmi una mano? Grazie mille!

  14. @Manuela: Ciao Manuela, puoi fare in 2 modi. Il più difficile comporta modificare manualmente il tema: occorre conoscere un minimo di HTML e CSS. Altrimenti devi cercare un tema che abbia widget che ti consenta di inserire ciò che vuoi sotto l’haeader (ad esempio, Thematic ha questa possibilità); tuttavia, se il sito è aziendale, dubito che tu possa cambiare tema… L’alternativa è inserire l’immagine non sotto l’header, ma nella sidebar.
    Mi è venuta in mente anche un’altra soluzione: se il tuo blog ha la possibilità di mettere un articolo in evidenza (se è fatto con WordPress, dovrebbe avere questa possibilità), allora puoi inserire l’immagine lì.

  15. Ciao Elisa, sto cercando di realizzare un sito per il mio lavoro.
    Ho però un problemino con la pagina home: vorrei togliere la possibilità di lasciare commenti, vorrei fosse una pagina statica di benvenuto. Cosa devo fare? Cosa devo cambiare nell’editor?
    Grazie mille

  16. @Alice: non esiste una risposta univoca, dipende dal tema che stai usando e da come è fatto. In alcuni temi è possibile abilitare o disabilitare i commenti direttamente nell’area della stesura commenti (quello che sto usando io è così). Se manca questa possibilità, allora in genere vai in “Aspetto>Editor”, e poi seleziona dal menu a destra le varie voci che riguardano le pagine (ad esempio: ‘pagina principale’, ‘loop-page’, ‘template pagine’) ed esaminale attentamente; la parte di codice che fa apparire i commenti è facilmente individuabile, appare come qualcosa di simile a:
    < ?php comments_template( '', true ); ?>
    Per togliere i commenti dalla pagina, devi eliminare questa parte di codice che fa apparire i commenti. Può essere che però, così facendo, poi i commenti risultino disattivati in tutte le pagine del blog, non solo sulla pagina principale; negli articoli, invece, sarà ancora possibile inserire commenti.
    Prima di fare qualsiasi modifica, ti consiglio di fare un backup del tema! ;) Così se c’è qualche problema puoi facilmente ripristinarlo.

  17. Ciao Elisa, scusa il disturbo ma vorrei chiederti se c’è un modo (possibilmente gratis) di modificare il colore dei titoli dei post, del testo dei post e il carattere del testo dei post.
    Grazie in anticipo :)

  18. Ciao, grazie mille, se usavo San Google prima invece di sbattere la testa per due sere , sicuramente avrei imprecato di meno!
    Ottimo lavoro, ottima guida e grazie mille ancora , mi hai risolto un bel problema!!

  19. @Marco: sì, bisogna fare delle modifiche ai CSS: cioè, occorre modificare il codice che regola l’aspetto grafico dei vari componenti della pagina web. Questo codice si trova nel file che di solito si chiama style.css. E’ gratis, tuttavia non semplicissimo: occorre avere una conoscenza almeno basilare dei CSS.
    @Ivan: Lieta di esserti stata d’aiuto! ;)

  20. Ciao, chiedo il tuo aiuto per un sito ancora in fase di lavorazione quindi non ancora online.
    Il mio intento è quello di avere una immagine di testata diversa per ogni pagina del sito e in più, in una particolare pagina, avere l’immagine di testata che cambia in modo casuale ogni volta che si ricarica la pagina. Per fare ciò ho impostato varie immagini come testate (con visualizzazione random) e poi ho inserito una featured image per tutte le pagine tranne quella in cui voglio che si alternino le immagini. Fino a questo punto è andato tutto bene ma quando sono andato a selezionare una delle tante pagine con la featured image come pagina degli articoli dalla sezione di “impostazioni lettura” non viene più visualizzata la featured image scelta ma solo le varie immagini di testata casuali. è come se per la pagina articoli non fosse possibile inserire una featured image.
    Sto sbagliando qualcosa io o non c’è proprio il modo di fare diversamente? Grazie mille in anticipo!!

  21. ciao Elisa, io ho creato una pagina con un editor html ora questa pagina l’ho salvata come index.html nella root dello spazio web dove c’é in teoria la pagina di cortesia salvata, ora in wordpress questa pagina non me la vede e io vorrei impostarla come home…o comunque come pagina principale senza che vi venga applicato lo stile css dl sito e che quindi non faccia parte del menu etc…ma si veda prprio solo e soltanto questa pagina…

  22. @Marcello: infatti credo che sia proprio come hai detto: non si può inserire una featured image per la pagina articoli. (Scusa il ritardo con cui ti rispondo, ho visto solo ora questo commento!).
    @Riccardo: WordPress non riconosce la pagina index da te creata perché è in html; dovresti farla in php. Io al tuo posto scriverei la pagina in wordpress, e poi la imposterei come Homepage: mi sembra la via più semplice.

  23. Ciao Elisa, è da poco che mi sono avvicinato al mondo WordPress e sono un po’ disorientato. A parte i comandi base che sono abbastanza chiari ho bisogno di chiarimenti su come creare un’homepage dinamica divisa in 4 settori nei quali compaiano alcune categorie ed alcuni articoli. Ho fatto una ricerca su internet sperando in un plugin ma non ho trovato nulla. Sai darmi qualche dritta? Ti ringrazio anticipatamente. Ric

  24. Ciao Elisa, io ho creato un template di pagina statica che ho impostato come home page. Vorrei cambiare lo sfondo della singola pagina, sto provando a modificare l’editor php della pagina statica, inserendo il tag:

    .PageList li.paginarock {background:url(img/post_bck.png) repeat !important;}

    Ma non funziona, sapresti dirmi cosa sto sbagliando?
    Grazie in anticipo. Claudio

Lascia un Commento

L'indirizzo email non verrà pubblicato. I campi obbligatori sono contrassegnati *

È possibile utilizzare questi tag ed attributi XHTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>