StackTips

How to Add Font Awesome Icons to Redux Options Panel

stacktips avtar

Written by:

Editorial,  2 min read,  updated on September 17, 2023

Redux WordPress framework includes Elusive Icons by default for your options panel icon needs. Elusive Icons are very limited in number. If you not happy with using Elusive Icons or, just want to include another web font (icon) framework such as Font Awesome, you can do that using the following code snippet.

Add the following code snippet to your redux framework options-init.php file.

// This is your option name where all the Redux data is stored.
$opt_name = 'my_theme_options';
//...

function add_font_awesome_icons() {
    // Uncomment this to remove elusive icon from the panel completely
    //wp_deregister_style( 'redux-elusive-icon' );
    //wp_deregister_style( 'redux-elusive-icon-ie7' );
 
    wp_register_style('redux-font-awesome', 
		'//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css',
        array(), time(), 'all'
    );
    wp_enqueue_style( 'redux-font-awesome' );
}

add_action('redux/page/' . $opt_name . '/enqueue', 'add_font_awesome_icons');