Si vous n’avez besoin que de quelques icônes, il est dommage de charger une police d’icônes complète comme Font Awesome. Icomoon est un outil permettant de générer une police avec uniquement les icônes dont vous avez besoin.
Générer sa police personnalisée
Rendez-vous sur le site d’Icomoon : https://icomoon.io
Cliquez sur le bouton Icomonn App en haut à droite de la page.
Recherchez les icônes qui vous intéressent en utilisant le champ de recherche et des mots clé en anglais.
Sélectionnez les icônes que vous souhaitez ajouter à votre police.
Cliquez sur Generate Font en bas à droite de la page, puis cliquez sur Download (au même endroit).
Comment intégrer la police dans son site web ?
Décompressez l’archive .zip de la police que vous avez généré.
Placez le contenu de l’archive zip dans un dossier nommé icomoon à l’intérieur de votre dossier racine (celui contenant votre site).
Liez la feuille de style d’Icomoon à votre page web avec la balise link
. Adaptez éventuellement le chemin d’accès de l’attribut href
.
<link rel="stylesheet" href="icomoon/style.css" >
Comment utiliser les icônes dans son site ?
Ouvrez le fichier demo.html présent votre dossier icomoon pour connaître le nom de l’icône que vous souhaitez insérer. Par exemple icon-bullhorn
.
Insérez l’icône en insérant le code correspondant dans votre page web sous la forme <span class="icon-bullhorn"></span>
.