FontAwesome is the web’s most popular icon set (used on 100,000,000 + websites) and toolkit with icons available for use in your workflow; be it on your website, favourite framework, or a photoshop document. Now in version ‘FontAwersome 5’ with a Free and paid Pro version (more icons, styles, tools), it now offers an even greater arsenal to creative types.
How to add FontAwesome 5 to WordPress
While we wait for the FontAwesome 5 Pro CDN you can easily add the FontAwesome Basic version to your site by enqueuing the FontAwesome Script via their CDN. Simply add the following snippet to your WordPress Theme’s functions.php file:-
Enqueue FontAwesome 5 to WordPress
Update for Adding CSS via CDN
Use the following code to add Font Awesome 5 Pro CSS//enqueues our external font awesome stylesheet
function enqueue_font_awesome(){
wp_enqueue_style('font-awesome', 'https://pro.fontawesome.com/releases/v5.1.0/css/all.css');
}
add_action('wp_enqueue_scripts','enqueue_font_awesome');
//Enqueue Fontawesome
wp_register_script( 'FontAwesome', 'https://use.fontawesome.com/releases/v5.0.2/js/all.js', null, null, true );
wp_enqueue_script('FontAwesome');
Super easy, just 2 lines of code and once you have saved your functions.php file you are ready to add in Icons your leisure with the standard markup:-
<i class="far fa-thumbs-up"></i>
Or you can use the CSS before declaration to include icons before elements like lists, links etc.
a:before {
font-family: FontAwesome;
content: "\f164";
display: inline-block;
padding-right: 4px;
vertical-align: middle;
}
About the Author
