Ajouter un favicon sur WordPress

Étiquettes : , ,

Le favicon sur WordPress fait partie des données qui définissent l’identité de votre site. Ne vous fiez pas à sa taille minuscule, il est indispensable!

Par définition, le favicon est une mini icône que l’on retrouve à 3 endroits différents de votre navigateur: la barre d’URL, les favoris et les onglets. En toute logique, il est souvent représenté par un logo d’entreprise ou celui du site, tout simplement.

À quoi sur le favicon sur WordPress?

Dans mon chapeau, je parle du favicon comme étant un élément indispensable d’un site. C’est à moitié vrai.
Ce n’est pas parce que votre WordPress n’arbore pas de joli favicon que le monde va exploser. Ceci dit, on remarque souvent que sur le web, chaque détail compte. Et le favicon se traduit souvent comme un travail et un web design abouti.

Favicon

Le favicon sur WordPress permet également à l’utilisateur de reconnaitre votre site parmi les 15 onglets ouverts sur son navigateur et les 36.000 favoris qu’il s’est promis de trier (demain).

Vous en voulez un aussi? Au boulot!

Un favicon en 3 étapes

Étape 1: la création

Commencez par définir ce que sera votre favicon. Veillez à ce que votre logo ou le motif de votre image ne soit pas trop compliqué car, comme vous l’aurez remarqué, le favicon est vraiment, VRAIMENT tout petit et devient vite illisible.

Vous avez fait votre choix? Parfait, rendez-vous maintenant sur un générateur de favicon en ligne. Personnellement, j’aime la simplicité de Genfavicon.com et Favicon-generator.com.
Un autre outil assez connu est Favicon.cc mais s’il offre des outils d’animation et de personnalisation, la qualité de l’image est assez réduite…

Bref! Importez votre image dans un de ces outils et réduisez-la au format 16×16 pixels. Ensuite, téléchargez-la. Vous constaterez que votre image apparait maintenant en format .ico, c’est gagné!

Étape 2: l’importation

Nous allons maintenant importer votre favicon sur WordPress, via votre serveur FTP.
Commencez par renommer votre image « favicon.ico » et dupliquez-la (de préférence à deux endroits différent car il est important que vos deux images portent le même nom).

Connectez-vous à votre FTP via Filezilla (par exemple) et uploadez votre favicon:

  • à la racine de votre WordPress, généralement situé dans le dossier WWW
  • dans le dossier de votre thème WordPress

Étape 3: la finalisation

Maintenant que votre favicon est sur votre site, nous allons indiquer à WordPress qu’il faut s’en servir.

Pour cela, il va falloir éditer le fichier header.php de votre site, soit via un éditeur de texte comme TextWangler, soit directement depuis l’interface admin de votre WordPress.

Une fois le fichier header.php ouvert, faites une rapide recherche pour retrouver la ligne de code qui commence par:

<link rel="shortcut icon"

et fini par:

/favicon.ico" />

Si elle existe, remplacez-la par le code suivant. Si elle n’existe pas, ajoutez ce code juste avant la balise:

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

Si votre favicon n’apparait pas tout de suite, videz votre cache (la fameuse…) et redémarrez votre browser. Et c’est fini, votre site possède maintenance ce petit « truc en plus », preuve de votre souci du détail 😉

Et vous, en avez-vous un sur votre site? Connaissez-vous d’autres méthodes pour créer votre favicon sur WordPress?


Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Devenez chroniqueur

Vous souhaitez devenir chroniqueur ou nous soumettre un article? Rien de plus simple.

Ça m'intéresse

#EPW sur Twitter

#EPW sur Facebook

À propos

Votre blog Écrire pour le web en chiffres
  • Plus de 25.000 sessions par mois
  • Plus de 35.000 pages vue chaque mois
  • 1500 abonnés à la newsletter
  • Créé en 2006
  • 1e position dans Google sur des expressions métier
En savoir plus