Comment ajouter et modifier un favicon WordPress

Les gens utilisent WordPress pour créer des sites Web pour les particuliers et les entreprises. Une façon d’aider les visiteurs réguliers à savoir que le site est le vôtre est d’avoir un favicon WordPress personnalisé.

Qu’est-ce qu’un favicon ?

Un favicon est une icône qui apparaît dans l’onglet ou la fenêtre du navigateur et dans la liste des signets ou des favoris spécifiquement associés à un site particulier. Si un navigateur ne trouve pas de favicon personnalisé, il affiche un favicon par défaut à la place.

Un favicon WordPress est souvent une version réduite du logo du site. Vous pouvez peut-être réduire le logo à la taille d’un favicon, mais il est généralement nécessaire d’en créer un en rapport avec le logo original.

Pourquoi devrais-je utiliser un favicon ?

Les entreprises devraient avoir un favicon pour améliorer la familiarité et encourager la confiance des clients potentiels. L’image de marque permet aux visiteurs de reconnaître un site instantanément. Elle ajoute de la continuité et de la légitimité.

Les particuliers peuvent également utiliser un favicon pour des raisons similaires, bien que l’objectif soit de fidéliser les visiteurs plutôt que d’effectuer des achats dans la plupart des situations.

Spécifications de la favicon

La taille du favicon dans WordPress est de 16×16 pixels. Cependant, certains autres navigateurs et applications utilisent une taille plus grande, allant de 16 à 195 pixels carrés.

Si vous vous en tenez à la taille 16×16, les applications qui utilisent des tailles plus grandes vont généralement l’agrandir, ce qui provoque souvent une pixellisation. Pour cette raison, l’identité du site de WordPress requiert plutôt du 512×512.

Certaines tailles alternatives courantes sont :

• 24 pixels – l’icône d’un site épinglé dans Internet Explorer 9
• 72 pixels – l’icône de l’écran d’accueil d’un iPad
• 128 pixels – l’icône utilisée sur le Chrome Web Store
• 195 pixels – l’icône affichée sur Opera Speed Dial

Formats des favicons

Un favicon ne s’affichera pas correctement s’il est enregistré dans un format incorrect. Le format le plus courant est Windows ICO, qui était l’exigence initiale. Il peut contenir une variété de tailles et de résolutions pour une utilisation sur plusieurs plateformes. C’est le seul format utilisé par Internet Explorer.

Le format PNG est l’option la plus conviviale, car presque tous les programmes graphiques peuvent enregistrer dans ce format. Il offre une petite taille de fichier et permet à la favicon d’être transparente si vous le souhaitez.

Opera prend en charge l’utilisation de SVG pour les favicons, mais c’est le seul navigateur qui le fait.

GIF, JPG, et APNG sont des options mais sont moins utiles car leur résolution est moins bonne, et ils peuvent être distrayants. La distraction est particulièrement probable avec les fichiers GIF animés et les fichiers APNG, qui sont également animés.

Création d’un favicon

Concevoir un favicon WordPress pour ajouter de la reconnaissance à votre site est une excellente idée. Vous pouvez en concevoir une sur un programme graphique sur votre ordinateur ou utiliser un site web gratuit en ligne, comme favicon-generator.org ou favicon.cc.

Tenez compte des facteurs suivants pour améliorer la valeur de votre favicon.

1- Identité

La raison la plus importante d’avoir un favicon est d’être reconnu. Créez un design qui représente le produit ou le service que vous offrez ou un design qui correspond au logo de votre marque. Une image en rapport direct avec votre marque, comme une version réduite du logo ou la ou les lettres principales du nom de l’entreprise, est idéale.

2 – Simplicité

En raison de sa petite taille, la simplicité est de mise. Les formes ou les lettres de base sont un bon choix pour la visibilité. C’est lorsque les visiteurs la reconnaissent d’un seul coup d’œil qu’elle est la plus efficace. Plus vous essayez d’inclure de détails, plus il est difficile pour le visiteur de reconnaître l’icône. La précision, l’audace et la clarté sont essentielles.

3 – Couleurs

Un contraste élevé améliore la lisibilité et augmente la reconnaissance. Considérez les favicons de sites tels que NBC et Netflix. Leurs sites sont immédiatement évidents. Les sites qui ont une identité de couleur claire devraient inclure cette couleur dans leur favicône WordPress. Encore une fois, restez simple. Trop de couleurs peuvent rendre l’image peu claire.

Comment ajouter un favicon à WordPress

Ajoutez un favicon WordPress en utilisant l’une des méthodes suivantes :

1) Utilisez l’option intégrée Site Icon de WordPress.

Passez la souris sur Apparence et choisissez Personnaliser, puis choisissez l’onglet Identité du site. L’icône du site se trouve en bas du panneau de gauche et vous permet de choisir une image carrée de 512 pixels ou plus, qui sera ensuite redimensionnée selon vos besoins.

Si le fichier que vous choisissez n’est pas un carré, WordPress fournit une interface pour recadrer l’image dans un carré.

2) Modifier le fichier header.php

Modifiez le fichier “header.php” de votre thème actuel et ajoutez ce code :

<link rel=”icon” href=”https://www.yourdomain.com/favicon.ico” type=”image/x-icon” >
 <link rel=”shortcut icon” href=”https://www.yourdomain.com/favicon.ico” type=”image/x-icon” />

Remplacez “yourdomain” par le nom de domaine de votre site, et assurez-vous de télécharger le favicon sur l’espace web.

Si vous voulez empêcher WordPress d’annuler la modification lors d’une mise à jour, créez un thème enfant avant de le modifier et modifiez le fichier du thème enfant au lieu du fichier du thème principal.

3) Utilisez un plugin WordPress.

Utilisez l’un des plugins que nous listons ci-dessous.

Comment modifier un favicon dans WordPress

Changer le favicon de WordPress est similaire à en ajouter un. Les mêmes méthodes fonctionnent pour télécharger un nouveau favicon. Il est également possible de télécharger une nouvelle icône et d’écraser l’ancienne, ce qui la modifiera lorsque les visiteurs videront leur cache ou effectueront un rafraîchissement complet.

Laissez Weapzy gérer vos mises à niveau et vos modifications si vous trouvez le processus déroutant. L’équipe est disponible 24 heures sur 24 et 7 jours sur 7 pour fournir un service et une assistance.

Simplifier-vous la vie avec un plugin WordPress Favicon

Facilitez le processus d’ajout ou de modification du favicon de WordPress en installant un plugin.

• Vous pouvez utiliser le plugin Insert Headers and Footers pour ajouter le code ci-dessus facilement. Collez le code dans la section de l’en-tête et enregistrez-le.
• Le plugin All in One Favicon ajoute la fonctionnalité pour faciliter le processus d’ajout d’un favicon.
• RealFaviconGenerator est un plugin qui génère des icônes en fonction des exigences du navigateur.
• Un autre plugin populaire est Heroic Favicon Generator, qui génère un favicon à partir d’une image téléchargée ou d’une image déjà présente dans votre médiathèque. Il utilise la fonction glisser-déposer pour télécharger les fichiers d’image.

Pourquoi mon favicon WordPress ne s’affiche-t-il pas ?

Il y a plusieurs raisons possibles pour les erreurs de favicon, de l’erreur de l’utilisateur aux idiosyncrasies du navigateur.

Cache

Lorsque votre site Web est mis en cache, les modifications apportées à des éléments tels que la favicon mettent du temps à s’afficher. Vous pouvez accélérer le processus en effectuant un rafraîchissement complet (Ctrl + F5) ou en vidant le cache du navigateur. Si cela ne résout pas le problème, vérifiez le type de fichier du favicon. S’il ne s’agit pas d’un fichier .ico, il se peut qu’il soit incompatible avec le navigateur.

Typos

Si vous avez une erreur typographique dans le code, le favicon risque d’être tronqué plutôt que de s’afficher. De simples erreurs telles qu’un guillemet, une barre oblique ou une parenthèse manquante provoquent des erreurs qui perturbent l’image, voire la page Web entière. Vérifiez soigneusement le code.

Emplacement du favicon de WordPress

La référence au fichier est également très spécifique. Si le lien (la partie entre les guillemets) pointe vers une image qui n’existe pas, le favicon ne s’affichera pas. Veillez à télécharger le fichier favicon et à copier le lien exact. La meilleure façon de faire est d’utiliser la bibliothèque de médias de WordPress.

Vue locale

Si vous vérifiez l’affichage sur un ordinateur local plutôt que de charger la page internet, le favicon WordPress ne s’affichera pas car la plupart des navigateurs ne recherchent pas le favicon localement. Vérifiez la page sur Internet pour être sûr qu’elle s’affiche pour les visiteurs.

Mauvais type d’image

Le type de fichier par défaut pour l’image de la favicon est .ico (“image/ico”). Si un autre type de fichier est utilisé, tel que PNG ou SVG, il doit être ajusté dans le code lors de l’utilisation de la modification du thème. Le type de fichier doit correspondre au type de fichier de l’image. Par exemple, un fichier PNG doit indiquer “image/png” au lieu de “image/ico”.

Pour plus d’informations sur toutes sortes de sujets liés à WordPress, abonnez-vous à la newsletter Weapzy !

Foire aux questions