Sommaire
Le plugin permet de générer très simplement toutes les déclinaisons de favicon et les déclinaisons propriétaires de type apple-touch-icon ou msapplication-TileImage
Utilisation
Placer le logo voulu soit :
- dans le menu configuration > Ajouter un logo de site
ou - placer dans votre répertoire squelette une image nommée icon/favicon.png
Pour que ce soit esthétiquement réussi, votre logo de site doit être carré, de 150 pixels de côté minimum.
Ensuite le plugin ajoute automatiquement dans le head de votre page, les déclinaisons de toutes les favicons avec la balise #INSERT_HEAD
Voici un exemple de code généré :
<link rel="shortcut icon" href="local/cache-gd2/9444631ffd3ddd2d111efbebb935ddc2.ico" type="image/x-icon" />
<link rel="apple-touch-icon" sizes="57x57" href="local/cache-gd2/e569705f477840ae1c549c12bfe4cafb.png" />
<link rel="apple-touch-icon" sizes="114x114" href="local/cache-gd2/34d11399ae3e76d10ac70a05596b47c8.png" />
<link rel="apple-touch-icon" sizes="72x72" href="local/cache-gd2/1505e94dd60a59f56d1cd358f69e3d1d.png" />
<link rel="apple-touch-icon" sizes="144x144" href="local/cache-gd2/99dea51baa23c07914725681f09ce3a4.png" />
<link rel="apple-touch-icon" sizes="60x60" href="local/cache-gd2/d6e2d9ad798b0f1aa954bf195738eb5a.png" />
<link rel="apple-touch-icon" sizes="120x120" href="local/cache-gd2/225cc8aba80e8836aadfc1e1f7936835.png" />
<link rel="apple-touch-icon" sizes="76x76" href="local/cache-gd2/d91730143b01bbd7cf7dd3c8be2d23b3.png" />
<link rel="icon" type="image/png" href="local/cache-gd2/9e0d479a319217b4b8ebebd39dd32758.png" sizes="96x96" />
<link rel="icon" type="image/png" href="local/cache-gd2/1dfb75427c01d50a405e5ce1408e16de.png" sizes="16x16" />
<link rel="icon" type="image/png" href="local/cache-gd2/1f2f660cee13267bbcced4d252cf9237.png" sizes="32x32" />
<meta name="msapplication-TileColor" content="#895aa4" />
<meta name="msapplication-TileImage" content="local/cache-gd2/34d11399ae3e76d10ac70a05596b47c8.png" />Le plugin est disponible sur Spip-Zone, n’hésitez à le modifier et le compléter.
Pour en savoir plus
Une synthèse assez complète sur les favicons https://github.com/audreyr/favicon-...
Discussions par date d’activité
Une discussion
Hello ici ! Et encore merci pour le plugin :-)
Petite question en revanche, qui m’est venue pendant que je traduisais sa doc :
Il me semblait avoir compris (notament d’après le post de Mathias Bynens sur les favicons, un des devs à l’origine d’HTML5 Boilerplate) que les noms des fichiers images et, leur placement à la racine du site, avaient leur importance quand même dans le processus (notamment pour les attributs
-precomposed) ? J’ai rêvé ou ... ?Parce que quand je vois le code généré par le plugin, j’ai un doute sur sa « validité » face à cette contrainte (si toutefois c’en est bien une et qu’elle soit encore valable en 2018) ?
Merci pour vos retours ;)
Répondre à ce message
Ajouter un commentaire
Suivre les commentaires :
|
