Come aggiungere una favicon WordPress al tuo sito web? (3 metodi)

Cos'è la favicon di WordPress?

Le Favicon di WordPress sono piccole icone solitamente di dimensioni 16×16 pixel che rappresentano il tuo marchio e si trovano vicino alla tua pagina che puoi facilmente vedere nella scheda del tuo browser.

In precedenza, quando Google Analytics non esisteva, le Favicon venivano utilizzate come strumento per determinare il traffico web. Ma ora è ben noto per migliorare l'esperienza utente e il riconoscimento del marchio.

Inoltre, avere una favicon WordPress aiuta nel riconoscimento del marchio. Dal momento che può essere facilmente visibile nelle schede del browser, nei segnalibri, negli archivi cronologici e così via. Possono anche essere utilizzati come collegamento a un sito Web su piccoli dispositivi come smartphone o schede. Aiuta a far risparmiare tempo agli utenti e consente loro di identificare facilmente il sito Web da navigare senza alcuna difficoltà.

Perché i vantaggi dell'utilizzo di WordPress Favicon sono?

Oltre al riconoscimento del marchio e al miglioramento dell'esperienza dell'utente, di cui abbiamo già discusso, il vantaggio dell'utilizzo di WordPress Favicon è che assicura al visitatore che sta navigando nel sito Web giusto e si trova sulla pagina giusta.

Supponiamo di aver aperto molte schede nel tuo browser, poiché il numero di schede aumenta, nasconderà il titolo del tuo sito Web come mostrato di seguito:

A questo punto, Favicon ti aiuta a identificare velocemente il tuo sito web in modo da poterlo cambiare facilmente. Puoi anche chiedere ai tuoi visitatori di aggiungere il collegamento al sito Web sulla schermata iniziale del browser o su piccoli dispositivi come gli smartphone per un accesso facile e rapido al tuo sito Web.

Dopotutto, uno degli obiettivi principali di ogni sito Web è fornire un'esperienza utente unica in modo che i visitatori possano visitare facilmente il sito Web ancora e ancora. Questo è ciò che WordPress Favicon aiuta nel tuo sito Web WordPress, aiutando a stabilire un forte riconoscimento del marchio e migliorando l'esperienza dell'utente al livello successivo.

Ora vediamo come puoi creare una bellissima favicon WordPress per il tuo sito web.

Come creare una favicon di WordPress?

Per creare WordPress Favicon la prima cosa che devi fare è decidere la dimensione di WordPress Favicon e per quali dispositivi dovrebbe supportare. Tuttavia, è disponibile un elenco completo delle diverse risoluzioni di Favicon che supportano vari browser e piattaforme.

Ma in questo post, utilizzeremo la risoluzione più consigliata e ampiamente accettata, in modo che diventi facile per te creare facilmente una favicon WordPress per il tuo sito Web senza alcuna confusione.

Alcuni migliori consigli per creare favicon di WordPress

• La risoluzione più consigliata per Favicon è 512×512 pixel.
• Scegli un'immagine che deve avere un bell'aspetto anche se è ridotta a una risoluzione di 16 × 16 pixel.
• Segui sempre le Linee guida fornite da Google per essere idoneo per una favicon accanto ai risultati di ricerca.
• Puoi scegliere tra immagini rettangolari o quadrate, poiché ti verrà fornita un'opzione per personalizzarle dopo o prima di caricarle su WordPress.

Ci sono molti modi attraverso i quali puoi creare una favicon di WordPress. Puoi assumere un designer in grado di comprendere meglio il tuo marchio e progettare una favicon dall'aspetto professionale. Puoi utilizzare WordPress Favicon Plugin per creare Favicon. Puoi persino progettare da solo se sai come utilizzare Adobe Photoshop.

Oltre a questo, sono disponibili anche vari strumenti online come il generatore di Favicon e Favicon.cc, con l'aiuto dei quali puoi creare facilmente Favicon.

Supponiamo di creare una favicon per il tuo sito Web, xyz.com. Non sai come usare Adobe Photoshop e anche tu non hai abbastanza budget per assumere un designer professionista. In questo caso, utilizzerai il generatore di Favicon.

per prima cosa, devi visitare il sito Web e caricare l'immagine che desideri che converta nella favicon del tuo sito Web come mostrato nell'immagine qui sotto:

Scegli le impostazioni appropriate, ad esempio

• Genera icone per app Web, Android, Microsoft e iOS
• Genera icone solo per WordPress 16×16 Favicon.ico

Seleziona le caselle e fai clic sul pulsante Crea favicon. La pagina Web si ricaricherà in una pagina di download da cui è possibile scaricare facilmente il file zip Favicon come mostrato di seguito:

Tuttavia, puoi anche aggiungere manualmente la Favicon al tuo sito web copiando il codice come mostrato sopra e incollandolo nell'intestazione del tuo documento HTML.

Se non hai scelto alcuno strumento per progettare la tua favicon e hai scelto di progettare da solo, ci sono alcuni punti che devi tenere a mente prima di iniziare a progettare.

• Mantieni il design semplice e pulito, poiché verrà ridotto che altri dettagli potrebbero perdersi.
• Il design della tua favicon deve essere dello stesso colore, grafica o caratteri del logo principale del tuo sito web o deve rappresentare il tuo marchio.
• Progetta prima la tua Favicon con una risoluzione maggiore, quindi ridimensionala secondo le tue esigenze.

Dopo aver finito di progettare la tua Favicon, devi salvare il file nel formato file supportato. In precedenza, c'era un particolare tipo di file Favicon di WordPress "WordPress Favicon.ico" ampiamente utilizzato. Ma ora le cose sono cambiate e al giorno d'oggi tutti i moderni browser Web ora supportano i formati di file PNG, GIF e ICO.

Tuttavia, sono disponibili anche formati di file JPEG e formati ampiamente utilizzati per salvare i file Favicon. Ma ci sono alcune versioni precedenti di Internet Explorer che non le supportano. Quindi, è meglio attenersi solo a coloro che hanno un supporto universale.

Come caricare la favicon di WordPress sul tuo sito?

Dopo aver progettato e salvato con successo la tua Favicon, è ora di caricare o aggiungere Favicon al tuo sito WordPress. Ci sono tre modi attraverso i quali puoi farlo,

1. Tramite il personalizzatore di WordPress
2. Utilizzo di un plug-in per aggiungere Favicon
3. Aggiunta manuale della favicon

Aggiunta di Favicon utilizzando il Personalizzatore di WordPress

Dopo il rilascio della versione 4.3 di WordPress, è stata introdotta una nuova opzione attraverso la quale diventa un modo semplice e veloce per caricare e ritagliare immagini da utilizzare come Favicon.

L'unica cosa che devi fare è caricare un'immagine nitida di alta qualità, preferibilmente con risoluzione 512X512. Prima di tutto, accedi alla dashboard di WordPress > Aspetto > personalizza , come mostrato di seguito:

La pagina verrà caricata per personalizzare la pagina in cui è necessario fare clic sulla scheda Identità del sito come mostrato di seguito:

Dopo aver fatto clic sulla scheda Identità del sito, devi cercare il pulsante "Seleziona l'icona del sito" come mostrato.

Successivamente, verrà visualizzata un'interfaccia di WordPress Media da cui puoi caricare immagini o utilizzare le immagini esistenti dalla libreria multimediale per creare la tua Favicon. Ora fai clic sul pulsante "Seleziona" situato nell'angolo in basso a destra.

Successivamente, puoi ritagliare o ridimensionare l'immagine selezionata per adattarla perfettamente alla tua Favicon, procedi facendo clic sul pulsante Ritaglia immagine per finalizzarla.

Dopo aver completato tutti i passaggi precedenti, è il momento di salvare tutte le modifiche e premere il pulsante di pubblicazione per renderlo attivo. Tuttavia, in qualsiasi momento, se non sei soddisfatto della tua Favicon, devi ripetere i passaggi precedenti per la modifica della Favicon di WordPress.

Utilizzo di un plug-in Favicon di WordPress per aggiungere Favicon al tuo sito

Se stai cercando più opzioni oltre alla funzione predefinita dell'icona del sito WordPress, puoi avvalerti dell'aiuto dei plug-in Favicon di WordPress. Sono disponibili vari plug-in Favicon gratuiti e popolari che hanno le stesse semplici funzionalità ma offrono molte più opzioni di compatibilità e un'esperienza più personalizzata.

Uno dei plugin Favicon di WordPress più popolari e ampiamente utilizzati che puoi utilizzare è Favicon di RealFaviconGenerator.

Questo plug-in ha preso la compatibilità troppo sul serio in modo da poter configurare Favicon reattivo compatibile con la maggior parte dei browser Web più diffusi.

Per cominciare, per prima cosa, devi installare il plug-in ReavFaviconGenerator tramite la dashboard di WordPress> Plugin> aggiungi Nuovo .

A seguire, fare clic sul pulsante Installa e attivarlo. Ora vai su Aspetto> Favicon e seleziona un'immagine che dovrebbe essere almeno 70 × 70 dal catalogo multimediale e fai clic sul pulsante Genera Favicon come mostrato di seguito:

Nel momento in cui fai clic su Genera favicon, verrai reindirizzato al sito Web del plug-in in cui devi scorrere verso il basso e fare clic sul pulsante " Genera le tue favicon e codice HTML ".

Mentre lo strumento funziona in background, ti reindirizzerà alla dashboard di WordPress. Ora la tua favicon è attiva e pronta.

Aggiunta manuale della favicon di WordPress

Se non sai come accedere alla directory principale, ti consigliamo vivamente di attenerti ai due semplici metodi sopra indicati. Ma se preferisci comunque utilizzare il metodo manuale, ti verrà richiesto di farlo tramite un client FTP o cPanel fornito dal tuo provider di hosting Web .

Passaggio 1: ma prima devi visitare il sito Web di Realfavicongenrator. Clicca sul pulsante " Seleziona la tua immagine Favicon " per generare la tua Favicon.

Una volta caricata l'immagine, noterai la stessa interfaccia utente proprio come durante l'utilizzo del plug-in RealFaviconGenerator. Personalizza o apporta modifiche se lo desideri e scorri verso il basso la pagina Web e fai clic sul pulsante " Genera le tue favicon e codice HTML " come mostrato di seguito:

Passaggio 2: quando fai clic sul pulsante Genera le tue Favicon e il codice HTML , la pagina si sposterà alla pagina successiva da dove puoi scaricare il Pacchetto Favicon .

Estrai il pacchetto Favicon scaricato e caricalo nella directory principale del tuo sito Web tramite un client FTP o cPanel fornito dal tuo client di hosting.

In WPOven , cerchiamo di offrire un'esperienza unica ai nostri utenti e la loro comodità è la nostra massima priorità. Quindi, forniamo un nuovo File Manager per gestire facilmente i file e le cartelle del tuo sito.

Ti presentiamo il nostro nuovo strumento del sito, il File Manager.

Utilizzando il File Manager di WPOven diventerà facile per te gestire i file e le cartelle del tuo sito. Puoi essere in grado di eseguire facilmente le seguenti varie attività.

• Installa plugin e temi di WordPress
• Crea, modifica, elimina, rinomina, sposta e aggiungi file e cartelle
• Crea archivi con zip o decomprimi e decomprimi i file
• Ordina i file
• Cerca file e cartelle
• Caricare files

Per accedere ai file e alle cartelle del tuo sito tramite lo strumento File Manager, devi prima accedere alla dashboard di WPOven. Quindi seleziona il sito su cui desideri lavorare.

Quindi seleziona il sottomenu " Strumenti " e fai clic sul pulsante " Avvia File Manager ".

Ora sarai in grado di vedere i file e le cartelle del tuo sito nel File Manager

Fare clic sul pulsante "Aggiungi file" e selezionare i file estratti da caricare.

Ma devi essere consapevole che il file che stai per inserire deve essere nella cartella principale o non funzionerà.

Passaggio 3: per completare l'intero processo e far funzionare le cose correttamente, l'ultimo passaggio che devi fare è aggiungere lo snippet di codice generato da RealFaviconGenerator alla sezione principale del tuo tema WordPress.

Per aggiungere il seguente frammento di codice alla sezione dell'intestazione, è necessario installare e attivare il plug-in intestazioni e piè di pagina. Quindi vai su Impostazioni> Inserisci intestazioni e piè di pagina e incolla lo snippet di codice nella sezione dell'intestazione come mostrato nell'immagine sottostante e fai clic su Salva.

Dopo aver terminato tutti i passaggi, la tua favicon dovrebbe iniziare ad apparire.

Cosa succede se la favicon di WordPress non viene visualizzata?

Se la tua Favicon WordPress non viene visualizzata, anche se hai seguito tutti i passaggi sopra menzionati, ciò può essere dovuto ai seguenti motivi:

1. Utilizzato un tipo di file Favicon WordPress errato : PNG, GIF e JPEG sono alcuni dei formati di file immagine che ora sono supportati dai browser moderni per Favicon. Ma non sono supportati dai vecchi browser. Inoltre, anche la maggior parte dei browser web preferisce l'uso del formato di file Favicon.ico di WordPress, quindi è meglio optare per. Formati ico per evitare problemi di compatibilità.
2. Impossibile configurare la dimensione della favicon appropriata – Un altro motivo per non mostrare Favicon al tuo sito Web può essere l'incompatibilità delle dimensioni dell'immagine della favicon con le dimensioni dello schermo del dispositivo. Questo può essere eliminato utilizzando il tipo di file favicon.ico che memorizza più versioni di un'immagine in diverse dimensioni e risoluzione. In questo modo, la favicon può essere facilmente visibile su qualsiasi dimensione dello schermo.
3. Plugin Favicon di WordPress incompatibile con il tema – È anche possibile che se stai utilizzando un plug-in generatore di Favicon di WordPress, mostri problemi di incompatibilità con il tema corrente che stai utilizzando. Quindi, è meglio controllare gli aggiornamenti del plug-in ed è compatibile con il tuo tema attuale e la versione di WordPress.

Sommario

Ora ti sei imbattuto in come WordPress Favicon può aiutare nel riconoscimento del marchio e nel migliorare l'esperienza dell'utente. E la parte migliore è che chiunque può facilmente creare e implementare Favicon sul proprio sito Web seguendo tutte le linee guida e questi semplici passaggi:

1. Puoi creare facilmente Favicon con molte delle opzioni disponibili, ad esempio utilizzando strumenti di generazione di Favicon online, plug-in e con l'aiuto di professionisti.
2. Puoi anche aggiungerli facilmente al tuo sito Web tramite l'opzione di personalizzazione di WordPress, utilizzare un plug-in o farlo manualmente.

Infine, se hai qualcosa di più prezioso da aggiungere che non abbiamo menzionato in questo post, faccelo sapere nella sezione commenti qui sotto:

Domande frequenti