How to Add Font Awesome Icons to WordPress Menus |
X

Congrats, You are Subscribed to Receive Updates.

How to Add Font Awesome Icons to WordPress Menus


How to Add Font Awesome Icons to WordPress Menus is one of a consistent way to show your custom icons on your Custom WordPress Plugin or Theme. First of all we need to know the important files which are necessary to work with fonts. The following line of code can help you to include all the fontawesome files, Especially fonts and css files,

wp_enqueue_style("kv_fontawesome", 'http://netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.css');

Now, we are necessary to write the custom css function to create custom class for our desired icon from fontawesome.

function kv_custom_css_font() {
   echo "<style type='text/css' media='screen'>
       #adminmenu .menu-icon-kv div.wp-menu-image:before {
            font-family:  FontAwesome !important;
            content: '\f06e'; 
        }
     </style>";
}
add_action('admin_head', 'kv_custom_css_font');

And here is an alternative method to add icons to admin custom menu.

add_action( 'admin_menu', 'kv_custom_menu_item' );

function kv_custom_menu_item(){
    add_menu_page( 'KVCodes', 'Kvcodes', 'manage_options', 'kvcodes', '', 'dashicons-shield' );
}

Here , ‘dashicons-shield’ Denotes a shield icon from the http://melchoyce.github.io/dashicons/.  You can choose your desired one from here. Else, you can use above class” .menu-icon-kv’ for your custom menus from the fontawesome face.

commenter

About Varadharaj V

The founder of Kvcodes, Varadharaj V is an ERP Analyst and a Web developer specializing in WordPress(WP), WP Theme development, WP Plugin development, Frontaccounting(FA), Sales, Purchases, Inventory, Ledgers, Payroll & HRM, CRM, FA Core Customization, PHP and Data Analyst. Database Management Advance Level

Comment Below

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

*

Current ye@r *

Menu

Sidebar