How to Add FontAwesome (or Other Icon Fonts) to your WP Theme or Plugin

So, you want to use FontAwesome in your Theme, eh? Add the following snippet to your functions.php file:

wp_enqueue_style( 'font-awesome', '//netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css' );

Do you want to use it in your Plugin? Just place that code in one of your functions within your plugin file and hook into the wp_enqueue_scripts Action:

add_action( 'wp_enqueue_scripts', 'plugin_slug_load_iconfont' );

function plugin_slug_load_iconfont() {
    wp_enqueue_style( 'font-awesome', '//netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css' );
}

The same principle holds true for the other icon fonts that are available online.

But here, this one’s even easier: Dashicons. They’re already included as part of the WordPress admin dashboard, so in order for you to get them working for non-logged in users, all you have to do is:

add_action( 'wp_enqueue_scripts', 'plugin_slug_load_dashicons' );

function plugin_slug_load_dashicons() {
    wp_enqueue_style( 'dashicons' );
}

Simple, right?

Leave a Reply

Your email address will not be published. Required fields are marked *