Inizio
/
WordPress
/
Come aggiungere Favicon di WordPress al tuo sito (4 metodi)

Come aggiungere Favicon di WordPress al tuo sito (4 metodi)

La favicon di WordPress è un piccolo ma potente simbolo dell’identità del tuo sito. Quest’icona aiuta un sito web WordPress a essere riconosciuto in un mercato online sempre più affollato. Sfruttare le favicon di WordPress ti consente di definire l’identità del tuo sito e migliorare l’esperienza utente.

Ma come si aggiungono le icone nel sito?

In questa guida, discuteremo della favicon di WordPress e ti mostreremo 4 modi per aggiungerne una al tuo sito. Ti daremo anche alcuni suggerimenti su come creare, rimuovere e dimensionare l’icona del tuo sito. Continua a leggere per comprendere questa funzionalità e scoprire il suo ruolo nel riconoscimento del marchio.

La favicon di un sito WordPress (aka icona preferita) è la piccola icona visualizzata nelle schede del browser. Viene anche mostrato nei preferiti o nelle icone delle app sulla schermata iniziale del tuo dispositivo mobile. Un’icona favicon è un’immagine che funge da segnale visivo per l’identità del tuo sito.

Di seguito è riportato un esempio di favicon su un sito Web WordPress.

Schermata che mostra come appare la Favicon di WordPress predefinita nella scheda del browser

Come aggiungere la Favicon in WordPress? (4 modi)

In questa sezione, ti mostreremo come aggiungere una favicon di WordPress al tuo sito in 4 diversi metodi.

Puoi usare quello che preferisci facendo clic su di esso qui sotto.

1. Aggiungere una Favicon usando il Customizer di WordPress
2. Cambiare la Favicon di WordPress usando l’Editor del Sito
3. Aggiungere le icone del Sito con un Plugin per Favicon di WordPress
4. Aggiungere manualmente una favicon al tuo sito WordPress

1. Aggiungere una Favicon usando il Customizer di WordPress

Aggiungere una favicon personalizzata, o “icona del sito”, al tuo sito WordPress è semplice se le impostazioni del tuo tema includono l’opzione.

Ecco come puoi farlo usando il Customizer di WordPress:

  1. Accedi alla dashboard di WordPress.
  2. Clicca su Aspetto > Personalizza per aprire il Customizer di WordPress.
    Schermata che mostra come andare al Customizer di WordPress dalla dashboard per cambiare la Favicon di WordPress
  3. Nel Customizer, cerca la sezione Denominazione del sito e clicca su di essa.
    Schermata che mostra come accedere alla scheda Identità del sito nel Customizer di WordPress
  4. Qui, clicca sul pulsante Seleziona l’icona del sito. Qui è dove carichi il tuo file della favicon.
    Screenshot che mostra l'opzione Seleziona icona sito nel Customizer
  5. Clicca sul pulsante Seleziona i file per caricare la tua immagine preferita.
    Screenshot che mostra l'opzione Seleziona File per caricare una Favicon WordPress

  6. Oppure seleziona un’icona esistente dalla Libreria multimediale di WordPress. La dimensione consigliata per una favicon è 512×512 pixels. WordPress ti permetterà di ritagliare le immagini se necessario.
    Schermata che mostra come selezionare un'immagine favicon dalla Libreria multimediale di WordPress
  7. Una volta pronto, clicca su Pubblica nella parte superiore del Customizer per salvare le modifiche.
    Screenshot che mostra il pulsante Pubblica per salvare l'icona del tuo sito WordPress caricato

La tua nuova favicon dovrebbe ora essere visibile nella scheda del browser quando visiti il tuo sito. Apparirà anche quando qualcuno aggiunge il tuo sito ai preferiti o lo aggiunge alla sua schermata iniziale in un dispositivo mobile.

2. Cambiare la Favicon di WordPress usando l’Editor del Sito

Dal rilascio della versione di WordPress 5.8, puoi cambiare la favicon utilizzando l’Editor del sito, purché il tuo tema lo supporti. Continua a leggere per padroneggiare il cambio di favicon di WordPress con l’editor del sito.

Ecco come farlo:

  1. Accedi alla tua bacheca di WordPress.
  2. Clicca su Aspetto > Editor.
    Schermata che mostra come accedere all'editor completo del sito di WordPress
  3. Una volta nell’Editor, cerca il pannello Pattern.
    Screenshot che mostra il pannello Patterns nell'Editor del sito
  4. Scorri verso il basso fino alla scheda Header e clicca sul pattern di blocco a sinistra.
    Screenshot che mostra come modificare il blocco del pannello Header per impostare una favicon
  5. Clicca sul blocco del logo del sito per Aggiungi un Logo del sito.
    Screenshot che mostra come caricare il logo di un sito nel blocco Pattern Header del tuo WordPress

  6. Quindi seleziona la tua favicon dalla Libreria multimediale o caricala.
  7. Premi Salva, poi Pubblica per applicare le modifiche.
    Schermata che mostra come salvare e pubblicare la tua Favicon WordPress utilizzando l'Editor del sito

3. Aggiungere le icone del Sito con un Plugin per Favicon di WordPress

Un altro metodo per aggiungere una favicon di WordPress al tuo sito è utilizzando un plugin come RealFaviconGenerator. Questo plugin gratuito fornisce un’interfaccia user-friendly per semplificare il processo di gestione e aggiornamento dell’icona del tuo sito.

Ecco come puoi procedere:

  1. Vai a Plugin > Aggiungi un nuovo plugin dalla tua dashboard.
  2. Installa e Attiva il plugin.
    Screenshot che mostra come installare il plugin RealFaviconGenerator su WordPress
  3. Vai a Aspetto > Favicon.
  4. Clicca sul pulsante Seleziona dalla libreria multimediale.
    Screenshot che mostra il pulsante Seleziona dalla Libreria multimediale in Aspetto Favicon

  5. Aggiungi l’immagine della favicon cliccando su di essa e premi Seleziona.
    Schermata che mostra come selezionare un'immagine favicon dalla Libreria multimediale in WordPress

  6. Clicca sul pulsante Genera Favicon
    Screenshot che mostra il pulsante Generate Favicon

  7. Questo ti reindirizzerà al sito di RealFaviconGenerator. Lo strumento ti consente di scegliere i caratteri e le dimensioni delle icone di WordPress. Puoi anche modificarne l’aspetto di come risulta nelle pagine dei risultati di ricerca di Google, nei browser da desktop e browser da dispositivi mobili come il browser Chrome o Safari.
    Screenshot che mostra come personalizzare i font web con il sito RealFaviconGenerator
  8. Scorri verso il basso fino a Favicon Generator Options, e conferma se questo è il primo pacchetto di favicon per il tuo sito o specifica la versione di favicon se ne stai modificando una esistente.
  9. Premi il pulsante Generate your Favicons and HTML code.
    Screenshot che mostra il pulsante Generate your Favicons and HTML code
  10. Il plugin genererà e installerà i file la Favicon sul tuo sito, mostrando nella tua bacheca un messaggio “Favicon is installed!“.
    Screenshot che mostra il messaggio Favicon Successfully Installed dal plugin RealFaviconGenerator

Con Real Favicon Generator, ti assicuri che la tua favicon sia nitida e professionale, sia visualizzata su browser da desktop, da dispositivo mobile o anche come icona di un’app.

Ricorda che il plugin deve rimanere attivo sul tuo sito per garantire che la tua favicon sia sempre attiva. Ciò contribuisce a creare un’immagine di marca coesa che gli utenti riconosceranno e di cui si fideranno.

4. Aggiungere manualmente una favicon al tuo sito WordPress

Questo approccio è adatto se le impostazioni del tuo tema non includono una scheda identità sito o se semplicemente preferisci procedere manualmente.

Per aggiungere una favicon manualmente, segui i passaggi seguenti:

  1. Crea la tua icona del sito e ottieni il tuo pacchetto zip favicon che contenga tutti i file ico.
  2. Carica il suo contenuto nella cartella principale del tuo sito. Puoi utilizzare un client FTP o il pannello di controllo Gestione file del tuo hosting. La cartella principale è solitamente public_html. Questa è la stessa cartella in cui puoi trovare le cartelle di WordPress come wp-content e wp-admin.
    Screenshot che mostra i file favicon caricati nella directory principale public_html
  3. In seguito, è necessario aggiungere il codice della favicon al tuo WordPress in modo che i browser sappiano dove trovare la favicon. Modifica il file header.php dei file del tuo tema tramite FTP o da Gestione File.

NOTA: fai attenzione quando modifichi il codice e considera l’utilizzo di un tema child per evitare di perdere le modifiche con gli aggiornamenti del tema.

  1. Inserisci la seguente riga di codice all’interno della sezione <head> del tuo file header.php:
link rel="icon" href="http://www.yourdomain.com/favicon.ico" type="image/x-icon"
Screenshot che mostra dove aggiungere il codice Favicon nell'header.php del tuo tema

Importante! Sostituisci http://www.tuodominio.com/favicon.ico con l’URL effettivo in cui è ospitato il tuo file favicon.

  1. Salva le modifiche nel file header.php

NOTA: se non vedi la tua favicon dopo averla implementata, assicurati di svuotare la cache del browser.

Questo è tutto! Ora conosci 4 modi diversi per aggiungere una favicon in WordPress.

Come rimuovere una Favicon da WordPress?

Non hai ancora creato il tuo logo o l’icona della favicon, ma vuoi rimuovere la favicon predefinita di WordPress? O forse stai apportando modifiche al marchio e rinnovando il tuo sito? Qualunque sia il motivo, continua a leggere per imparare come eliminare un’immagine favicon esistente.

Per rimuovere una favicon dal tuo sito WordPress, segui questi passaggi:

  1. Vai alla tua bacheca di WordPress.
  2. Clicca su Aspetto > Personalizza.
  3. Trova la scheda Identità sito
  4. Scorri verso il basso fino all’opzione icona del Sito.
  5. Clicca su Rimuovi o cancella il file immagine esistente impostato come favicon.
    Screenshot che mostra il pulsante Rimuovi favicon nel Customizer
  6. Non dimenticare di salvare le modifiche cliccando su Pubblica.

Questo è tutto! La tua favicon di WordPress è ora stata rimossa, e puoi aggiungerne una nuova se questo è il tuo obiettivo.

Come creare una Favicon?

Creare una favicon può essere facile e veloce, specialmente con strumenti web come RealFaviconGenerator.

Ecco una guida sintetica:

  1. Progetta la tua icona. Crea un design semplice e chiaro. Inizia con un’immagine quadrata (512×512 pixel è l’ideale) che rappresenta il tuo marchio, come un logo semplificato. Puoi utilizzare vari strumenti come Adobe Photoshop, GIMP o Canva.
  2. Vai su realfavicongenerator web tool e carica la tua immagine.
    Schermata che mostra come caricare un'immagine favicon nel sito Web di RealFaviconGenerator
  3. Ottieni il pacchetto Favicon e il codice html e procedi con il Metodo di caricamento manuale .
    Schermata che mostra come ottenere il pacchetto favicon e il codice HTML dal sito Web RealFaviconGenerator
  4. In alternativa, installa il plugin RealFav iconGenerator sul tuo sito WordPress. Ti aiuterà a convertire la tua immagine nel formato .ico. Inoltre, ti aiuterà a implementare il tuo design su tutte le piattaforme e dispositivi senza creare manualmente dimensioni diverse
  5. Carica e genera. Attraverso l’interfaccia del plugin, carica il tuo design. RealFaviconGenerator creerà automaticamente i file favicon necessari e il codice HTML.
  6. Pubblica. Salva le modifiche all’interno del plugin e aggiungi il codice HTML al tuo header.php. Quindi, la tua nuova favicon sarà online, fornendo un’esperienza di marchio coerente per tutti i tuoi visitatori.

Dimensione immagine Favicon & Linee guida

Quando crei una favicon, assicurati che l’immagine sia un quadrato con dimensioni di almeno 512×512 pixels. Opta per il salvataggio nei formati PNG o SVG, per il loro ampio supporto da browser e la loro scalabilità.

Ecco come creare una favicon efficace:

  • La semplicità è la chiave: un design pulito e diretto sarà più efficace con uno spazio limitato.
  • Rappresentazione del marchio: la tua favicon dovrebbe riflettere chiaramente il tuo marchio. Se il tuo logo non è quadrato, adattalo per adattarsi al formato della favicon senza perderne l’essenza.
  • Testo minimo o assente: evita di utilizzare del testo a meno che non faccia parte dell’identità del tuo marchio. Se è necessario, utilizza il minor numero di caratteri possibile.
  • Considerazioni sui colori: scegli i colori che si adattano ai diversi sfondi del browser, inclusi bianco, grigio e nero, per garantire la visibilità in modalità chiaro e scuro.

La tua favicon dovrebbe essere facilmente riconoscibile per mantenere la continuità del marchio su varie piattaforme e ambienti di navigazione.

Il ruolo dell’icona di un sito WordPress nel riconoscimento del marchio

L’icona di un sito in WordPress gioca un ruolo cruciale nel riconoscimento del marchio poiché distingue il tuo sito web nei browser e dispositivi moderni. Questo piccola ma significativa grafica appare nella scheda del browser, nei preferiti, nella cronologia e anche quando viene salvato nella schermata iniziale di uno smartphone. Offre un identificatore coerente e immediato per il tuo sito tra le molte schede e segnalibri che un utente potrebbe avere aperto.

Adottare una favicon unica e memorabile che si allinea con il logo, i colori e l’identità del tuo marchio stabilisce una presenza online più professionale. Migliora l’esperienza dell’utente e promuove la familiarità del marchio. Ogni volta che un utente incontra la tua favicon di WordPress, rafforza l’immagine del tuo marchio, rendendola essenziale per creare fiducia e riconoscimento nello spazio digitale.

Condividi questo articolo