This is a quick fix tutorial on how to fix Font awesome Icons not showing in WordPress. This can help in fixing the problem in less then 2 mins..

Sometimes font awesome showing blank squares and sometimes don’t see the icons at all.

Why Font Awesome icons not showing?

The current version of Font Awesome 5.0.0 + comes with five styles which require five different type of Style Prefix, for example:

Style Availability Style Prefix Example
Solid Free fas <i class="fas fa-camera"></i>
Regular Pro Required far <i class="far fa-camera"></i>
Light Pro Required fal <i class="fal fa-camera"></i>
Duotone Pro Required fad <i class="fad fa-camera"></i>
Brands Free fab <i class="fab fa-font-awesome"></i>

 

Only Solid & Brand icons are free to use, So most of the time we will be using fas & fab as Style prefix for using font awesome icons in our WordPress theme.

font awesome icon showing as square box

I am using cdnjs for loading font awesome’s Css and Js files, which you can see in image below:

As we can see I am using “https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/fontawesome.min.css” and “https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/js/fontawesome.min.js” file in my current WordPress theme development project.

Cdnjs provides us various options to add Css and Js files for using font-awesome in our web development projects which you can see in screenshots given below.

font awesome Css files from cdnjs
font awesome js file from cdnjs

To render the font awesome icons correctly we need to replace these two files fontawesome.min.css and fontawesome.min.js with https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css and https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/js/all.min.js respectively.

Once replacement is done save your project and reload the web page you can now see the font awesome icons are showing without any error.

font awesome icon fixed and rendering correctly

Stay connected and you can also subscribe to my channel TheWebGuru – YouTube Channel

Thank you, All your comments and queries are most welcome.