Utilizzando questo sito accetti il nostro uso dei cookie. Approfondisci

Aggiungere la favicon a WordPress: come e perchè

Aggiungere la favicon a WordPress: come e perchè


La favicon è l’icona 16X16 associata ad una pagina web. Solitamente viene creata a partire dal logo e viene visualizzata a fianco del titolo della pagina che si sta visualizzando oppure,  se la pagina viene memorizzata tra i preferiti, nella scheda dei segnalibri.

Ma veniamo ai fatti, la favicon è questa:

favicon

A cosa serve

La favicon è molto comoda quando si hanno molte schede aperte nello stesso browser così da ritrovare immediatamente tutte le pagine e/o articoli associati ad un determinato sito. L’immagine è molto più immediata rispetto al titolo della pagina.

Con più finestre

Ad esempio, vedendo la favicon nell’immagine di sopra sai che quella pagina è associata al mio blog.

Inoltre permette di instaurare un rapporto, seppur debole, con l’utente, che vede il sito meno anonimo e più professionale rispetto a chi non possiede nessuna favicon personalizzata.

Come si crea

Bisogna partire da un’immagine quadrata, preferibilmente con sfondo trasparente e con estensione .gif o .png. Dopodichè si può procedere in due modi:

1. Manuale

Personalmente preferisco usare un programma di fotoritocco come Gimp (è gratuito) e ridimensionare il logo con dimensione 16X16. Salvo l’immagine con il nome favicon.ico (attenzione all’estensione .ico).

2. Programma

Ti puoi affidare ad un qualunque programma gratuito online, ad esempio favicon.cc, molto intuitivo. Carichi la tua immagine,  si avvia in automatico la conversione in icona 16X16 e poi la scarichi sul tuo computer.

Come aggiungere la favicon in WordPress

Plugin? Naaaaa… non mi piace avere troppi plugin, per questo con poche righe di codice ti mostrerò come aggiungere una favicon personalizzata nel tuo blog WordPress senza utilizzare nessun plugin.

Carica la tua nuova favicon sul tuo spazio web tramite FTP nella root (solitamente dove sono presenti le cartelle di WordPress e tutti i file).

Dopodichè fai un backup (scaricandolo sul tuo computer) del file functions.php del tuo tema (lo trovi in /wp-content/themes/nome-tema/functions.php) e da Aspetto > Editor > functions.php aggiungi questo codice prima della chiusura dell’ultimo tag ?> :

/* Aggiungi la favicon al tuo Blog
 * by Roberto Iacono di robertoiacono.it
 */
function ri_wp_favicon() { ?>
	<link rel="shortcut icon" type="image/x-icon" href="URL FAVICON" />
<?php }
add_action('wp_head', 'ri_wp_favicon');

Al posto di URL FAVICON devi inserire l’URL della tua favicon, che dipende da dove hai inserito la tua favicon. Se l’hai inserita nella root, l’URL dovrà essere del tipo: http://www.nome-sito.it/favicon.ico .

Se invece decidi di inserire la favicon nella cartella images del tuo tema, allora dovrai usare questo codice:

/* Aggiungi la favicon al tuo Blog
 * by Roberto Iacono di robertoiacono.it
 */
function ri_wp_favicon() { ?>
	<link rel="shortcut icon" type="image/x-icon" href="<?php echo bloginfo('stylesheet_directory'); ?>/images/favicon.ico" />
<?php }
add_action('wp_head', 'ri_wp_favicon');

Ora cancella la cache del tuo browser, aggiorna la pagina e vedrai comparire la tua nuova favicon :)


VUOI CREARE IL TUO SITO O BLOG WORDPRESS?

Scegli uno tra i migliori hosting per WordPress

HOSTING

Scegli uno tra i migliori hosting per WordPress

Hosting

Scegli uno tra i migliori temi WordPress professionali

GRAFICA

Scegli uno tra i migliori temi WordPress professionali

Grafica

Guide e risorse per gestire il sito WordPress a 360°

GESTIONE

Guide e risorse per gestire il sito WordPress a 360°

Gestione

EMAIL NEWSLETTER

Vuoi ricevere i miei ultimi articoli
comodamente nella tua email? È gratis!
Ben 3552 persone lo stanno già facendo!
Anonimo
   
con le dita sempre in costante, frenetico movimento sulla tastiera… vengo spesso trascinato e catturato “in rete” per colpa delle mille idee che mi girano per la testa (prima o poi troverò quella giusta)… dal futuro incerto (nonostante una laurea, e chi non lo è?..siamo in tanti!) .. credo fortemente nella condivisione della conoscenza!
5 Commenti
  • cribri

    Ciao Roberto!

    Quindi Logo e Favicon sono fatti con la stessa immagine o ci sono casi in cui differiscono?

    • Roberto Iacono

      Ciao Cri!

      È tutto a tua discrezione, possono anche differire.

  • Nicola

    Ciao Roberto,
    devo dire che il tuo blog è quanto di più utile abbia mai trovato in rete. Se non altro i tutorial sono chiarissimi anche for i dummies come me :)

    Forse la domanda è stupida, ma ho provato a modificare la favicon per un sito in costruzione, attualmente off-line, inserendo il codice che suggerivi nel file functions-php. Ma non funziona, purtroppo.

    Se può esserti utile sto utilizzando il framework gantry 4.0.5 e ho caricato il sito su server di VHosting Solutions.

    Puoi aiutarmi a capire cosa non va?

    Grazie

  • Nicola

    La favicon si è aggiornata automaticamente. Non è stato necessario fare nulla se non cambiare il file favicon.ico. Probabilmente il ritardo nell’aggiornamento è stato solo un problema di cache del browser, anche se l’avevo già svuotata più volte. Grazie comunque per i consigli del tuo blog.

    • Roberto Iacono

      Sì, sicuramente è la cache del browser,
      ciao

Seguimi

Scarica gli ebook gratuiti

Vuoi creare e gestire il tuo blog WordPress autonomamente ed in maniera gratuita?

Allora scarica gratuitamente gli ebook Blogging Box e Le 30+ cose da non fare con WordPress, inserisci la tua email qui sotto:
13591+
Scarica gratuitamente gli ebook!

Per maggiori informazioni guarda questa pagina per la Blogging Box e questa per le 30+ cose da non fare con WordPress.

Scarica gli ebook gratuiti

Vuoi creare e gestire il tuo blog WordPress autonomamente ed in maniera gratuita?

Allora scarica gratuitamente gli ebook Blogging Box e Le 30+ cose da non fare con WordPress, inserisci la tua email qui sotto:
13591+
Scarica gratuitamente gli ebook!

Per maggiori informazioni guarda questa pagina per la Blogging Box e questa per le 30+ cose da non fare con WordPress.
Unisciti agli oltre 10999 lettori
che seguono questo blog
3152
982
2251
4614