Come aggiungere Favicon al tuo sito WordPress

Hai appena creato un sito web con il CMS WordPress ma noti che manca la piccola icona nella tab del browser(in alto) e non sai come aggiungerla? Non preoccuparti, ti aiutiamo noi! Qui ti faremo vedere come aggiungere l’icona Favicon al tuo sito WordPress.

Il “Favicon” (o la favicon), è quella piccola icona che vedi in alto nella tab del tuo browser, e rappresenta il tuo sito web. E’ il “brand”, il simbolo che ti rappresenta, l’icona che vedi quando salvi il sito web nei segnalibri, e non averne uno potrebbe farti apparire poco professionale agli occhi di possibili visitatori. (Ha inoltre inaspettate funzioni SEO). Ma vediamo subito come aggiungere il favicon al tuo progetto web.

Formati e dimensini del Favicon

Come abbiamo già detto, il Favicon è quel simbolo che vedi nella tab del tuo browser o quando salvi il sito nei segnalibri, e sta a rappresentare il sito web in questione. l formati più usati per questa icona sono ICO e PNG, in quanto vengono supportati dalla maggior parte dei browser. (ma con le ultime versioni di WordPress puoi tranquillamente usare anche GIF e JPEG).

La dimensione ideale è 512×512 pixel(quindi un quadrato). A te basterà inserire un file di quelle dimensioni, in quanto WordPress si occuperà di creare automaticamente i file di dimensioni 32×32, 180×180, 192×192 e 270×270 per adattarsi a tutti i dispositivi.

Una volta i favicon con formato ICO andavano posizionati direttamente nella directory principale del tuo sito, ma ora, grazie a WordPress, puoi agire direttamente da li(da dentro wordpress) ed inserire file PNG, JPEG ecc). Ma andiamo a vedere come si crea un favicon.

Come creare Favicon per WordPress

Ora vediamo qual è la procedura standard per creare un’icona favicon per il tuo sito, usando uno dei più popolari software fotografici, ovvero Photoshop. (Lo so, puoi creare il favicon anche con tantissimi servizi online, ma questa è la via più professionale).

  • Come prima cosa apri Photoshop e clicca in alto a destra su “File” e poi su “Nuovo“.
  • Imposta la dimensione 512×512, incolla il tuo logo e salva il tuo file come PNG(o GIF). Ricordati che questi formatiti consentono di avere uno sfondo trasparente, utile per far vedere nella tab del browser solo il simbolo e non l’intera foto quadrata.

Come aggiungere Favicon al tuo sito WordPress

Una volta creato il tuo favicon, non ti resta che andarlo ad inserire tramite WordPress. Hai tre possibilità di inserimento: tramite le opzioni di personalizzazione di wordpress, tramite un plugin o manualmente della directory principale del tuo sito web.

Il metodo più utilizzato è senza dubbio l’aggiunta del favicon direttamente tramite WordPress: Tu aggiungi un’immagine ed il CMS farà tutto lui!

  • Recati nella bacheca del tuo sito wordpress, quindi in “Aspetto“(dalla colonna di sinistra).
  • Clicca poi su “Personalizza e, nella nuova schermata individua le voci “Opzioni Generali” o direttamente “Denominazione del sito” (o Site Identity).
  • Qui puoi inserire il titolo ed il motto del tuo sito web e, scorrendo verso il basso, l’icona favicon. Noterai anche l’info: “Le icone del sito sono quelle che vedete nelle schede del browser, nella barra dei preferiti, e all’interno delle app mobile di WordPress, Caricane una qui!“.

Aggiungere icona sito WordPress

  • Carica la tua icona e la vedrai, dopo un refresh, subito nella tab del tuo browser. Una volta caricata, sarà wordpress ad adattarla automaticamente nelle varie dimensioni!

Se invece vuoi aggiungere il favicon tramite un plugin, è semplicissimo: recati nella bacheca del tuo sito wordpress e quindi in “Plugin“. Ora, dopo aver cliccato su “Aggiungi uno”, cerca (in alto a destra) il plugin “Favicon by RealFaviconGenerator“.

Dopo aver installato il pugin, vai in “Aspetto“(la colonna principale a sinistra) e “Favicon“. Qui carica la tua icona, clicca su “Genera icona, dopo una piccola elaborazione, clicca su “Generate your favicon” (nella nuova schermata) e vedrai l’anteprima del tuo favico per tutti i dispositivi.

Se invece vuoi aggiungere manualmente il favicon al tuo sito web, devi caricare il file ICO nella directory principale del tuo sito web(raggiungibile tramite cPanel o FTP). Una volta aggiunti il file, devi andare ad inserire il seguente codice all’interno dell’header del tuo sito web: <link rel="icon" type="image/x-icon" href="linkdelfaviconchehaicaricato suwordpress.ico">

Una volta fatto eseguiti questi passaggi, vedrai il tuo bel favicon padroneggiare la tab del browser. Facile no?! Per ulteriori info, guarda il video Youtube di Elegant Themes. Bene, vi abbiamo fatto vedere come aggiungere Favicon al tuo sito WordPress. Speriamo di esservi stati di aiuto, ciao e alla prossima! Leggi anche: come-cambiare-tema-con-wordpress.

Simone Icolaro
Seguimi su:
Latest posts by Simone Icolaro (see all)