Dans la barre d’onglets de votre na­vi­ga­teur, un onglet séparé s’ouvre à chaque nouvelle page, contenant le titre de la page du site et une petite icône : le favicon. Ces deux in­for­ma­tions per­met­tent à l’uti­li­sa­teur d’iden­ti­fier plus fa­ci­le­ment une page d’accueil et de s’orienter lorsque plusieurs onglets sont ouverts en même temps. Le favicon d’un site Web fait également partie de l’image de marque de l’en­tre­prise et améliore l’ex­pé­rience de l’uti­li­sa­teur. Il y a trois façons d’ajouter un favicon WordPress. Nous ex­pli­quons étape par étape leur fonc­tion­ne­ment et les avantages de chaque option.

Pourquoi ajouter un favicon WordPress ?

Le terme favicon est l’abré­via­tion de « Favorite Icon ». Cette petite icône fait partie in­té­grante de la présence d’une en­tre­prise sur le Web. Elle s’affiche dans la barre d’onglets, la barre de signets, les ap­pli­ca­tions mobiles WordPress et les résultats de recherche. En con­sé­quence, il est re­com­mandé de choisir une icône sig­ni­fi­ca­tive et unique comme favicon. Cela présente de nombreux avantages :

  • Le favicon augmente le sérieux et le pro­fes­sion­na­lisme d’un site Web.
  • Il permet à l’uti­li­sa­teur de re­con­naître plus fa­ci­le­ment l’en­tre­prise et ses services sur le Web et améliore ainsi l’ex­pé­rience de l’uti­li­sa­teur du site.
  • Il a un effet positif sur le SEO.
  • Si un uti­li­sa­teur a plusieurs onglets ouverts en même temps dans le na­vi­ga­teur, les titres des pages sont cachés. Le favicon, en revanche, reste toujours visible.
Conseil

La plupart des en­tre­prises mettent leur logo ou une variante de celui-ci comme favicon dans WordPress.

Ajouter un favicon WordPress

Il existe trois pos­si­bi­li­tés pour ajouter un favicon WordPress : avec le WordPress Cus­to­mi­zer, un plugin ou ma­nuel­le­ment. Nous vous pré­sen­tons ci-dessous les options plus en détail.

Note

Dans cet article, nous ex­pli­quons comment insérer dans WordPress un favicon que vous avez déjà créé au­pa­ra­vant. Cela fonc­tionne soit avec des pro­grammes gra­phiques courants, soit avec un Favicon Generator très pratique.

Méthode 1 : WordPress Cus­to­mi­zer

Le moyen le plus simple et le plus rapide d’ajouter un favicon WordPress est dis­po­nible depuis la version 4.3 de WordPress. Avec cet outil favicon de WordPress, vous té­lé­char­gez le favicon, le coupez si né­ces­saire et le con­fi­gu­rez en quelques clics.

Avec cette version, la taille minimale re­com­man­dée pour un favicon est de 512 x 512 pixels. Dans l’onglet du na­vi­ga­teur, cependant, l’image est affichée dans une taille de 16 x 16 pixels. Par con­sé­quent, assurez-vous que votre favicon est fa­ci­le­ment re­con­nais­sable, même dans cette taille. Nous ex­pli­quons étape par étape comment ajouter un favicon WordPress avec le Cus­to­mi­zer.

Étape 1 : ouvrir le Cus­to­mi­zer

Dans le tableau de bord WordPress, suivez le chemin « Design » « Cus­to­mi­zer ».

Étape 2 : ouvrir les in­for­ma­tions sur le site web

Le Cus­to­mi­zer WordPress s’ouvre. Sé­lec­tion­nez ensuite la rubrique « In­for­ma­tions sur le site Web ».

Étape 3 : ouvrir la sélection des favicons

Dans cette section, vous pouvez définir le titre et le sous-titre du site Web. Cette in­for­ma­tion est affichée à côté du favicon dans l’onglet du na­vi­ga­teur. Dans la section « Icône du site », cliquez sur le bouton « Sé­lec­tion­ner l’icône du site » pour per­son­na­li­ser le favicon dans WordPress.

Etape 4 : sé­lec­tion­ner le favicon

Ouverture de la mé­dia­thèque WordPress. Si vous avez déjà té­lé­chargé le favicon, sé­lec­tion­nez-le main­te­nant. Sinon, cliquez sur l’onglet « Charger des fichiers » et sé­lec­tion­nez le fichier approprié sur votre or­di­na­teur. Confirmez votre sélection en cliquant sur le bouton « Sé­lec­tion­ner ».

Etape 5 : découper le favicon

Ensuite, vous avez la pos­si­bi­lité de recadrer l’image. WordPress affiche au­to­ma­ti­que­ment un aperçu du favicon dans la zone de droite. Dès que vous avez défini la découpe de l’image, confirmez votre sélection avec le bouton « Découper l’image ». Si votre favicon a déjà la bonne taille, sé­lec­tion­nez « Sauter le recadrage ».

WordPress reprend au­to­ma­ti­que­ment le favicon. Pour modifier le favicon de WordPress, retournez à cette zone de pa­ra­mètres.

New call-to-action

Méthode 2 : plugin Favicon

WordPress offre un plugin approprié pour (presque) toutes les fonctions, y compris l’insertion d’un favicon. L’un des plug-ins gratuits les plus po­pu­laires est le Favicon by Real­Fa­vi­con­Ge­ne­ra­tor. Par rapport au WordPress Cus­to­mi­zer, il offre des options de réglage sup­plé­men­taires pour améliorer la com­pa­ti­bi­lité du favicon avec dif­fé­rents appareils et icônes d’ap­pli­ca­tions. Dans ce qui suit, nous ex­pli­quons comment créer un favicon dans WordPress avec ce plug-in.

Etape 1 : installer le plugin

Dans le tableau de bord WordPress, ouvrez la section Plug-ins, puis la section « Installer ».

Re­cher­chez le plugin « Favicon by Real­Fa­vi­con­Ge­ne­ra­tor », sé­lec­tion­nez le résultat de recherche approprié et cliquez enfin sur « Installer main­te­nant ». Cliquez ensuite sur « Activer » et le plugin est prêt à l’emploi.

Étape 2 : ouvrir les pa­ra­mètres du plug-in

Une fois le plugin installé, suivez le chemin « Design » > « Favicon » dans le menu. Vous y trouverez les pa­ra­mètres du plug-in.

Étape 3 : choisir un favicon

Cliquez sur « Sé­lec­tion­ner dans la bi­blio­thèque de médias » pour ouvrir la bi­blio­thèque WordPress et sé­lec­tion­nez l’image de votre favicon. Dans ce cas, vous avez besoin du favicon dans une taille d’au moins 70 x 70 pixels, mais 260 x 260 pixels ou plus est re­com­mandé. Après avoir sé­lec­tionné l’image, confirmez votre choix en cliquant sur le bouton « Générer le favicon ».

Étape 4 : créer un favicon

Le plugin vous re­di­ri­gera ensuite au­to­ma­ti­que­ment vers votre propre site web. Dès que l’image a été té­lé­char­gée avec succès, des pa­ra­mètres op­tion­nels sont à votre dis­po­si­tion. Si vous le souhaitez, vous pouvez ajuster l’affichage du favicon pour le na­vi­ga­teur du bureau, pour les résultats de recherche Google ou pour divers smart­phones.

Si vous avez accepté tous les pa­ra­mètres ou si vous voulez ignorer les autres, cliquez sur le bouton « Générer vos favicons et votre code HTML » à la fin de la page.

Le plugin vous redirige vers le backend de WordPress et confirme l’ins­tal­la­tion réussie du favicon dans WordPress.

Méthode 3 : insertion manuelle

Dans de nombreux cas, WordPress offre également la pos­si­bi­lité de faire des réglages ma­nuel­le­ment. Un favicon WordPress peut donc également être ajouté via le File Transfer Protocol (FTP). Pour cela, vous avez besoin d’un paquet de favicon avec dif­fé­rents fichiers et un code HTML. Les deux peuvent être créés fa­ci­le­ment grâce à un outil en ligne gratuit.

Etape 1 : générer des fichiers favicon

Ouvrez un outil en ligne pour générer un favicon. Dans cet exemple, nous utilisons le Real Favicon Generator. Cliquez sur le bouton « Sé­lec­tion­nez l’image de votre favicon » pour té­lé­char­ger l’image ap­pro­priée pour le favicon WordPress.

Ensuite, des pa­ra­mètres op­tion­nels sont dis­po­nibles pour modifier la taille et le fond de l’image. Faites les chan­ge­ments souhaités ou passez ces étapes. Cliquez ensuite sur le bouton « Générez vos Favicons et votre code HTML » en bas de page.

Ensuite, vous avez la pos­si­bi­lité de té­lé­char­ger le paquet favicon et de copier le code HTML. Té­lé­char­gez le paquet et renommez-le en « favicon.ico ». De cette façon, le graphique est di­rec­te­ment reconnu comme favicon.

Étape 2 : té­lé­char­ge­ment du paquet de favicons via FTP

Accédez aux données WordPress via FTP. Ouvrez le ré­per­toire racine et té­lé­char­gez le paquet favicon à cet endroit. Assurez-vous qu’il se trouve dans le même dossier que le dossier WP Admin ou le dossier WP Content.

Étape 3 : insérer le code HTML

Ensuite, ouvrez le fichier header.php et insérez le code HTML du favicon dans la zone d’en-tête. Assurez-vous que votre domaine et le chemin du favicon sont cor­rec­te­ment spécifiés.

Conseil

Un hé­ber­ge­ment WordPress pro­fes­sion­nel offre un démarrage facile, plus de sécurité et des sau­ve­gardes au­to­ma­tiques pour votre site WordPress.

Aller au menu principal