Caractères d’icônes dans WordPress: qu’est – ce qu’ils sont et comment les utiliser (manuel \/ plug – in)
Les polices d’icônes sont un outil très utile pour les sites WordPress. Ils vous permettent d’ajouter des symboles et des images à un site sans ralentir le site. C’est pourquoi les polices d’icônes sont devenues populaires ces dernières années. Si vous n’êtes pas certain de ce sujet, ce billet de blog peut vous aider. Dans ce livre, vous apprendrez ce qu’est un caractère d’icône et pourquoi c’est une bonne idée de les utiliser. Ensuite, vous recevrez des instructions détaillées sur la façon d’ajouter des polices d’icônes aux sites WordPress manuellement ou via un plugin. Ça te va? Alors commençons à travailler.
Qu’est – ce que les polices d’icônes et pourquoi les utiliser? Avant de discuter de l’utilisation des polices d’icônes dans WordPress, déterminons ce qu’elles sont. Ils contiennent des symboles, pas des lettres comme leur nom l’indique, et les polices d’icônes sont des polices comme d’autres polices personnalisées. Ils ne sont toutefois pas alphanumériques, mais contiennent des symboles et des pictogrammes. En fait, chaque site WordPress a une police d’icônes par défaut. Il s’appelle dashicons et fournit des symboles dans le menu principal WordPress.
Great font – une bibliothèque de plus de 1300 symboles gratuits. Ils couvrent un large éventail de sujets, allant des flèches à la santé, à l’éducation, à la marque, etc. Collection générale d’icônes créées par genericons Automatic. Vous pouvez trouver ces fichiers sur github. Polices – ce service combine différentes polices d’icônes en un seul endroit et vous permet de créer des bibliothèques qui ne contiennent que les symboles requis, ce qui permet d’économiser de l’espace dans le processus. Vous trouverez plus
Polices d’icônes ici et dans cet article. Vous apprendrez bientôt à les utiliser. Avantages de l’utilisation de polices d’icônes cela ne laisse qu’une question, pourquoi utiliser des polices d’icônes? Pourquoi ne pas le remplacer par une photo? Les polices d’icônes se sont révélées présenter plusieurs avantages par rapport aux images traditionnelles:
En tant qu’images vectorielles, elles peuvent s’adapter à n’importe quelle taille sans perte de qualité. Excellente fonctionnalité pour une conception réactive. Comme pour tout autre texte Web, vous pouvez facilement manipuler les polices d’icônes via CSS. Par exemple, vous pouvez changer sa taille et sa couleur, ajouter des ombres extérieures, tourner les ombres, et ainsi de suite. Ils vous permettent de stocker plusieurs symboles dans un seul fichier. Cela réduit les requêtes http par rapport au chargement de plusieurs images. Les polices d’icônes n’augmentent pas significativement le poids de la page, en particulier lorsque vous utilisez une bibliothèque qui ne contient que les icônes désirées. Bonne nouvelle sur le temps de chargement de la page! Maintenant que vous savez pourquoi c’est une bonne idée d’utiliser des polices d’icônes dans WordPress, voyons comment les ajouter à votre site.
Comment ajouter manuellement des polices d’icônes dans WordPress tout d’abord, nous discuterons de la façon d’inclure manuellement des polices d’icônes dans WordPress. C’est la meilleure solution lors de la création d’un thème pour utiliser des polices d’icônes. Vous permet de travailler sans plug – ins que l’utilisateur ou le client pourrait accidentellement modifier ou supprimer. Il existe deux autres façons d’y parvenir. Tout au long du tutoriel, nous utiliserons les grandes polices mentionnées précédemment. C’est la bibliothèque la plus populaire avec de nombreux symboles gratuits disponibles. Cependant, les principes que vous allez apprendre s’appliquent également à d’autres caractères d’icône.
Méthode 1: les polices d’icônes de polices supplémentaires distantes peuvent être ajoutées à votre site Web comme n’importe quelle autre police personnalisée
Ou: Télécharger à partir d’un serveur distant. Tout ce dont vous avez besoin, c’est de leur adresse d’hébergement. Font AWESOME fournit son propre CDN pour cela, que vous pouvez trouver et configurer ici.
Wp \ u enqueue \ u style (‘NS font AWESOME’, ‘ https:\/\/use.fontawesome.com\/releases\/v5.3.1\/css\/all.css «);
}
Ajouter _ action (‘WP enqueue scripts’,’ NS add font AWESOME ‘); WordPress chargera font AWESOME à partir d’un emplacement distant sur votre site.
Méthode 2: hébergez les polices séparément. Alternativement, vous pouvez héberger les fichiers de polices sur le serveur. C’est une bonne idée pour réduire les requêtes http ou les problèmes gdpr. La première étape de cette méthode consiste à télécharger les polices et à les décompresser. Pour font AWESOME, vous trouverez le lien de téléchargement au même endroit que l’adresse CDN, juste au bas de la page. Après avoir entré le disque dur, décompressez le fichier et lancez le client FTP (par exemple Filezilla). Allez dans le dossier des sujets actifs dans le contenu WP > thèmes. Là, créez un nouveau répertoire et donnez – lui un nom unique semblable à la police, puis téléchargez tout ce que vous venez de télécharger. Ensuite, utilisez ce code dans la fonction pour télécharger les polices sur votre site. PHP:
Fonction NS _ add font AWESOME () {
WP _ enqueue style (‘NS font AWESOME’, get Stylesheet Directory Uri (). ‘ LB \/ CSS \/ all. CSS minimal»);
}
Ajouter _ action (‘WP enqueue scripts’,’ NS add font AWESOME ‘); Lorsque les caractères apparaissent, vous n’avez qu’à apprendre à afficher les symboles sur le site. Pour ce faire, vous devez aller à une excellente liste de symboles de police. Cliquez sur n’importe quelle icône que vous souhaitez utiliser. Cela vous donnera son nom et le Code dont vous avez besoin pour l’insérer dans le site.
C’est pour quand?
Maintenant que vous l’insérez quelque part dans votre site (par exemple, pied de page), vous obtiendrez les résultats suivants:
Taille de la police: 38px;
Couleur: # 222;
}
– Oui. Fa Twitter: stationnaire {
Couleur: # 767676;
} pour simplifier l’opération, vous pouvez également grouper plusieurs icônes dans un autre élément HTML, comme suit:
Cela vous permet de changer le style de toutes les icônes à la fois. Pour l’exemple ci – dessus, il en va de même:
– Oui. Groupe d’icônes sociales
Taille de la police: 38px;
Couleur: # 222;
}
– Oui. Groupe d’icônes sociales I: vol stationnaire {
Couleur: # 767676;
} en outre, vous pouvez utiliser des styles plus complexes comme Redimensionner, utiliser une largeur fixe, tourner, etc. Toutefois, dans la plupart des cas, c’est le cas. Vous pouvez maintenant utiliser les polices d’icônes dans les thèmes WordPress. Ajoutez des polices d’icônes via le plugin wordpress. Bien sûr, WordPress vous permet également d’utiliser des polices d’icônes via le plugin. C’est la meilleure solution si vous voulez les utiliser dans les messages et les pages, ou donner aux clients l’occasion de le faire. Il existe de nombreux plugins WordPress qui peuvent vous aider, par exemple:
Icônes wow liste générale des icônes WP SVG cependant, dans ce tutoriel, nous utiliserons une meilleure police AWESOME. Non seulement c’est la solution la plus populaire, mais elle est aussi facile à utiliser et à mettre à jour. 1. Installez le plug – in. Bien sûr, la première chose que vous devez faire est d’installer le plug – in défectueux. Pour ce faire, allez au plug – in > Ajouter un nouveau contenu et tapez son nom dans la barre de recherche. Lorsque vous le trouverez dans la liste, cliquez sur Installer maintenant. Activez le plug – in à la fin du téléchargement. 2. Une fois que les paramètres du plug – in de configuration sont activés, veuillez trouver les paramètres de configuration du plug – in sous paramètres > meilleure police est géniale.
L’icône teri, que vous trouverez dans cet article. En bref, les polices d’icônes et les polices d’icônes WordPress offrent une excellente alternative aux fichiers image pour ajouter des icônes, des symboles et des pictogrammes à votre site. Ils sont disponibles gratuitement, offrent une large gamme d’options, sont faciles à modéliser et nécessitent moins de ressources que les images classiques. De plus, vous pouvez les utiliser comme d’autres polices et profiter de tous leurs avantages. Ci – dessus, vous avez appris non seulement ce que sont les polices d’icônes et pourquoi c’est une bonne idée de les utiliser, mais aussi comment ajouter cette police à WordPress. Vous pouvez le faire manuellement en téléchargeant un rôle à partir d’une source externe ou en l’hébergeant sur le serveur. Alternativement, vous pouvez utiliser une solution plug – in pour implémenter la même fonctionnalité. Quelle que soit l’option que vous choisissez, nous espérons que vous profiterez pleinement de cette ressource magique. Utilisez – vous des polices d’icônes dans WordPress? Quelle est votre façon préférée de les ajouter au site? Veuillez nous le dire dans la section commentaires ci – dessous!