6 years ago (2015-01-28)  Algorithm language |   First to comment  6 
post score 0 times, average 0.0

Friends who visit this site can find that the author's navigation menu is with icons, and wordpress navigation menu default is no icon, the following is my blog icon effect: And these icons are like text, you can change its color, Can beautify our web interface.Here, a word is raised: Font Awesome

Font Awesome Introduction

Font Awesome is a popular font icon tool.With the popularity of Bootstrap gradually recognized, FontAwesome can not only be used on bt, but also can be applied to various web front-end development.Compared to the traditional use of background images as icons, the font icons mainly support adaptation, can use various features of the font (such as discoloration, larger and smaller, font shadows, etc.), reduce data loading, and styles are more easily defined.

Font Awesome features

  1. One font file, 369 icons.
  2. No JavaScript required: Faster loading speed
  3. Unlimited scalability: Scalable vector graphics means that every icon looks awesome at any size.
  4. Free and free: You can apply it to your business.
  5. CSS controls: Easily define the icon's color, size, shadow, and any CSS-related features.
  6. Perfect retina display: Use vector fonts, which means they can be perfectly displayed in high resolution displays
  7. Born for Bootstrap: Fully Compatible with Bootstrap New 3.0
  8. Desktop friendly: you can see a list of font styles
  9. Compatible screen reader: Unlike other font icons, screen readers are not compatible

Use of Font Awesome

  1. You just have to go to: http://fontawesome.io Download the archive and extract it to your project.
  2. Add the corresponding font-awesome style to the head of your HTML header.
  3. Start your project based on the case here.

For compatibility with Internet Explorer, use version 3.2.1 of Font-awesome.Download font-awesome-ie7.css or font-awesome-ie7.min.css.Then introduce the style file in the project.

How to set icons for wordpress directory

    1. First introduced in header.php, I put the above file in the theme directory, so the introduction of code is

Then set a menu in the wordpress background - menu editor such as the home page navigation tag attributes:

How to set icons for wordpress navigation menu Now the general theme has been cited Font Awesome, you may wish to try the final step directly to see if you can successfully load the icon, so you can save you a lot of time


This article has been printed on copyright and is protected by copyright laws. It must not be reproduced without permission.If you need to reprint, please contact the author or visit the copyright to obtain the authorization. If you feel that this article is useful to you, you can click the "Sponsoring Author" below to call the author!

Reprinted Note Source: Baiyuan's Blog>>https://wangbaiyuan.cn/en/how-to-wordpress-directory-settings-icon-2.html

Post comment


No Comment


Forget password?