Come aggiungere il favicon al sito - sia nel front end che nel pannello di amministrazione

Question

Come aggiungere il favicon al sito - sia nel front end che nel pannello di amministrazione

16 mar 2014, 07:41:59

Visualizzazioni: 16.5K

Voti: 8

Come posso aggiungere il favicon al mio sito WordPress sia nel front end che nel pannello di amministrazione. Ho provato diversi metodi senza successo.

So che per mostrare il favicon il codice è:

<link rel="shortcut icon" href="images/favicon.ico" />

Come posso implementarlo?

Mayeenul Islam

12.9K

plugin temi favicon

Tutte le risposte alla domanda

Commenti

Risposta corretta. Questo aiuterà molte persone là fuori. Uso questo codice nel mio plugin da un po' di tempo.

Pieter Goosen

16 mar 2014 07:56:04

Questa risposta merita decisamente più voti positivi.

Smokey

16 ott 2014 08:05:02

Ottima risposta, tranne per il fatto che dovresti usare get_stylesheet_directory_uri(), non get_template_directory_uri() per i child theme! :)

Eric Holmes

30 ott 2015 23:00:30

@EricHolmes In realtà intendevo così, ma ho capito, potrebbe essere confuso, quindi ora è corretto. Grazie per il tuo commento. :)

Mayeenul Islam

31 ott 2015 17:18:28

Sono in ritardo per rispondere a questa discussione. Ma forse potrebbe essere utile a qualcuno in futuro.

Vai al Pannello di Amministrazione di WordPress, poi,

Aspetto » Personalizza » Identità del sito

Ora carica un'icona.

Usman Siddiqui

41

4 dic 2016 09:01:33

Commenti

sì, quella funzionalità è stata aggiunta nella versione 4.4 se non ricordo male

Mark Kaplun

4 dic 2016 09:09:24

mmm questo non lo sapevo :)

Usman Siddiqui

5 dic 2016 10:42:54

Con le versioni recenti di WordPress, questo è probabilmente il modo migliore.

João Teixeira

28 mar 2022 10:04:43

Mayeenul Islam 12.9K · Accepted Answer · 2014-03-16T07:41:59Z

Aggiornamento

La seguente soluzione alternativa è necessaria per gli utenti che utilizzano WordPress in una versione precedente alla 4.4. Se stai utilizzando WordPress v4.4 o successiva, non è necessario ricorrere a un metodo così esteso. Segui semplicemente la risposta di Usman Siddiqui, ed è così facile.

Risposta Effettiva

Puoi aggiungere una favicon al tuo sito WordPress in due modi:

tramite il Tema, oppure
tramite un Plugin

Preparazione

Per aggiungere una favicon, prima devi crearne una. Le favicon hanno tipicamente dimensioni di:

16px x 16px, oppure
32px x 32px.

Quindi, per prima cosa, creane una utilizzando un software grafico e salva il file con il nome 'favicon' nel formato .png (per la trasparenza) o .jpg ecc. Rinomina il file e cambia l'estensione in .ico (file icona) - quindi il tuo file sarà favicon.ico.

Tramite il tema:

Codice Statico

Per implementare la favicon utilizzando il tema, devi ricordare che stai utilizzando WordPress e devi farlo nel modo giusto di WordPress. Per mostrare il percorso esatto del file, devi usare get_template_directory_uri() per il tema genitore, oppure get_stylesheet_directory_uri() per i temi figlio. Quindi il tuo codice per implementare la favicon sarà (dove il file favicon.ico è salvato in una cartella chiamata "images" all'interno della cartella del tuo tema):

<link rel="shortcut icon" href="<?php echo get_template_directory_uri(); ?>/images/favicon.ico" />

Puoi inserire il blocco di codice sopra tra i tag <head> e </head> del tuo tema per far funzionare la favicon.

Codice Dinamico

Per implementare la favicon in modo dinamico, utilizza il seguente codice:

function add_my_favicon() {
   $favicon_path = get_template_directory_uri() . '/images/favicon.ico';

   echo '<link rel="shortcut icon" href="' . esc_url($favicon_path) . '" />';
}

add_action( 'wp_head', 'add_my_favicon' ); //front end
add_action( 'admin_head', 'add_my_favicon' ); //admin end

Abbiamo utilizzato lo stesso codice, ma ora lo abbiamo racchiuso in una funzione per attivare l'azione. Poi abbiamo aggiunto l'azione utilizzando due hook:

wp_head — mostrerà la favicon nel front end utilizzando la funzione WordPress wp_head() nella sezione head del tuo tema
admin_head — mostrerà la favicon nel pannello di amministrazione

Tramite plugin

Puoi creare il tuo plugin per impostare la favicon del tuo sito. È meglio perché, anche se cambi il tema del tuo sito, la tua favicon non verrà persa. Ecco come implementarla con il nostro plugin personalizzato:

<?php
/*
Plugin Name: My Favicon Plugin
Description: Attivazione di una favicon nel mio sito.
*/

function add_my_favicon() {
    $favicon_path = plugins_url( '/favicon.ico', __FILE__ );    

    echo '<link rel="shortcut icon" href="' . esc_url($favicon_path) . '" />';
}


add_action( 'wp_head', 'add_my_favicon' ); //front end
add_action( 'admin_head', 'add_my_favicon' ); //admin end

Salva il file con il nome my-favicon.php in una cartella e posiziona il tuo file favicon.ico all'interno di quella cartella. Dai alla cartella il nome my-favicon e inseriscila in /wp-content/plugins/. Ora accedi al pannello di amministrazione di WordPress e attiva il plugin per vedere la tua favicon in azione. :)

Apple Touch Icon

Inoltre, con questi metodi, puoi anche implementare un'icona Apple Touch:

Implementare un'Icona Apple Touch di helgatheviking — Sviluppo WordPress

Le dimensioni di un'icona Apple Touch sono 129px x 129px. :)