Adding Font Awesome And Ion Icons to WordPress

Here’s how to add Font Awesome and Ion Icons to your WordPress theme.

In case you need them to replace the default DashIcon on your WordPress theme.

To enqueue Ion Icons and Font Awesome. Place the code given below at the bottom of your active theme function.php.

Adding Ion Icons using WP Enqueue

//* Enqueue Ionicons
add_action( 'wp_enqueue_scripts', 'digi_enqueue_ionicons' );
function digi_enqueue_ionicons() {
  wp_enqueue_style( 'ionicons', '//code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css', array(), CHILD_THEME_VERSION );
}

Enqueue Font Awesome to WordPress

//* Enqueue Font Awesome
add_action( 'wp_enqueue_scripts', 'digi_enqueue_fontawesome' );
function digi_enqueue_fontawesome() {
  wp_enqueue_style( 'font-awesome', '//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css' );
}

Adding both together

Note! the code above is how to add Font Awesome and Ion Icons separately.

If you want to add both of them, use this code instead:

//* Enqueue Ion Icons And Font Awesome
add_action( 'wp_enqueue_scripts', 'digi_enqueue_icon' );
function digi_enqueue_icon() {
  wp_enqueue_style( 'font-awesome', '//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css' );

wp_enqueue_style( 'ionicons', '//code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css', array(), CHILD_THEME_VERSION );

}

And don’t forget to click on the Update File button on your WP Theme Editor to save the change.

Okay, thats it! hope you find this super short post is useful 🙂