Pour une navigation plus conviviale au sein de votre site web, peut-être que vous avez déjà pensé ajouter des icônes au menu de votre thème WordPress ? Grâce à « Font Awesome », vous allez pouvoir importer une bibliothèque de plus de 600 icônes. Plus incroyable encore, vous n’aurez pas besoin de plugin ni de télécharger quoi que ce soit… Il vous faudra simplement ajouter une ligne de code…

Comment ajouter des icônes à son site web ?

Pour commencer, il suffit d’éditer le fichier header.php de votre thème (de préférence de votre thème enfant).

Ensuite nous allons ajouter la ligne suivante à l’intérieur de la balise <head>.

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet">

Il ne reste plus qu’à sauvegarder votre fichier header.php et vous êtes maintenant prêt à insérer des icônes dans la barre de menu de votre thème WordPress.

Trouvez des icônes que vous souhaitez ajouter au menu de votre site.

Maintenant, il ne vous reste plus qu’à fouiller dans la bibliothèque de Font Awesome pour trouver les icônes qui vous conviennent.

Il suffit de cliquer dessus pour afficher un écran comme celui ci-dessous.

01-ajouter-icones-menu-theme
Il est indiqué que vous devez ajouter une balise <i> pour insérer votre icône. Dans notre exemple, on récupérera le code suivant :

<i class="fa fa-graduation-cap" aria-hidden="true"></i>
Le site de Font Awesome recommande de passer l’attribut aria-hidden à true, ceci afin de ne pas afficher l’icône sur les lecteurs d’écran.

Ces appareils sont destinés aux personnes aveugles ou malvoyantes et le fait de ne pas afficher l’icône évitera une information redondante ou inutile pour ces personnes.

La dernière étape consiste à ajouter ce code avant le libellé de notre menu.

02-ajouter-icones-menu-theme

Voilà, vous savez maintenant comment ajouter une icône à votre menu. Comme vous l’avez constaté, c’est relativement simple. Peut-être avez une autre méthode à suggérer en commentaire ? 😉

Pin It on Pinterest

Share This