Apple Touch Icon per WordPress

Apple Touch Icon per WordPress

10 Agosto 2016 Off Di gnius

Apple Touch Icon
WordPress è una delle piattaforme più usate per la pubblicazione su web, permette di avere facilmente e rapidamente il proprio sito online e ci sono moltissimi temi e plugin per avere il sito personalizzato.
Una delle funzionalità che possono permettere al nostro sito di aumentare le visite e di semplificare l’accesso da parte degli utenti è quello di implementare le Apple Touch Icon.

Implementare le Apple Touch Icon scaricando un Plugin

La più grande forza di WordPress è la presenza di centinaia di sviluppatori che producono e correggono moltissimi plugin, pezzetti di codice che aggiungono o modificano le funzionalità base di WordPress. Basta fare una ricerca nella pagina di ricerca dei plugin e vengono fuori diversi plugin che integreranno non solo le icone per i dispositivi Apple iOS, anche i dispositivi Android usufruiranno di questa possibilità.

La scelta del plugin specifico ricade ovviamente fra le scelte personali e dipende anche dalla compatibilità della versione di WordPress che state usando con il plugin che intendete installare.
Un plugin che ci sentiamo di consigliare visto il gran numero di installazioni e la frequenza di aggiornamento è Multicons [Multiple Favicon] il plugin ha più di 10000 installazioni e una valutazione di 5 stelle su 5: più che ottima.

L’unica cosa che dovrete fare è installare ed attivare il plugin. Una volta fatto dovrete andare caricare i file per ogni icona che intendete attivare, ed andare nella pagina di configurazione del plugin indicare la directory in cui si trovano i file con le icone.
Salvate ed il gioco è fatto.

Implementare le Apple Touch Icon personalizzate

La piattaforma WordPress permette anche a chi non ha approfondite conoscenze di programmazione di fare modifiche ed aggiunte al proprio sito.
Per l’implementazione delle Apple Touch Icon ci sentiamo in dovere di darvi qualche consiglio su quale sia il modo migliore per l’aggiunta di queste icone extra.

Ci sono tre modi per ottenere l’aggiunta alla sezione head della pagina:

  1. Accodare i meta tag relativi in qualche modo nel file functions.php.
  2. Creare un semplice plugin che aggiunga i meta tag necessari alla sezione head della pagina.
  3. Aggiungere i meta a mano al file header.php.

premesso che non esiste una risposta giusta si può parlare però di soluzione più flessibile.

La soluzione 1 e la 3 sono ottime se avete fretta di aggiungere i meta al vostro sito e non avete intenzione di modificare il tema.
Aggiungete lo snippet in basso al vostro file functions.php, oppure aggiungete tag link al file header.php potete anche usare i tag link che ci sono nello snippet più in basso rimuovendo il codice php non necessario.

La soluzione più flessibile è quella di creare un plugin molto semplice con una funzione che si agganci allo wp_head ed aggiunga così i meta alle pagine del vostro sito.

<?php
add_action('wp_head', 'add_your_stuff');
function add_your_stuff() {
?>
 <link rel="shortcut icon" href="<?= get_stylesheet_directory_uri();?>/favicon.ico" type="image/x-icon" />
 <link rel="apple-touch-icon" href="<?= get_stylesheet_directory_uri();?>/apple-touch-icon.png" />
 <link rel="apple-touch-icon" sizes="57x57" href="<?= get_stylesheet_directory_uri();?>/apple-touch-icon-57x57.png" />
 <link rel="apple-touch-icon" sizes="72x72" href="<?= get_stylesheet_directory_uri();?>/apple-touch-icon-72x72.png" />
 <link rel="apple-touch-icon" sizes="76x76" href="<?= get_stylesheet_directory_uri();?>/apple-touch-icon-76x76.png" />
 <link rel="apple-touch-icon" sizes="114x114" href="<?= get_stylesheet_directory_uri();?>/apple-touch-icon-114x114.png" />
 <link rel="apple-touch-icon" sizes="120x120" href="<?= get_stylesheet_directory_uri();?>/apple-touch-icon-120x120.png" />
 <link rel="apple-touch-icon" sizes="144x144" href="<?= get_stylesheet_directory_uri();?>/apple-touch-icon-144x144.png" />
 <link rel="apple-touch-icon" sizes="152x152" href="<?= get_stylesheet_directory_uri();?>/apple-touch-icon-152x152.png" />
<?php
}
?>

In questo modo potrete cambiare il tema del vostro sito senza dovere modificare né il file functions.php ne il file header.php.

 

Spread the love