WordPress add Dashicons for new menu

When we add new menu page in WordPress in our custom plugins or theme functions we use the ‘add_menu_page‘ page function which can option to pass icon path of that menu.
Here is the code snippet of the default example:

add_action('admin_menu', 'members_downloads_menu');
function members_downloads_menu() {
 if (is_admin()){
 add_menu_page('Members Downloads Options', 'Members Downlods', 'manage_options', 'members-downloads','members_downloads_page',plugins_url('your-plugin-folder/images/icon.png'), 80 );
 }
}

Since WordPress version 3.8 there is option to use Dashicons instead of any images used as icons. Dashicons is the official icon font of the WordPress admin as of 3.8.

Here is the code snippet to show where to replace the icon path to Dashicons:

add_action('admin_menu', 'members_downloads_menu');
function members_downloads_menu() {
 if (is_admin()){
 add_menu_page('Members Downloads Options', 'Members Downlods', 'manage_options', 'members-downloads','members_downloads_page','dashicons-download', 80 );
 }
}

You can notice that I have replaced the icon path with ‘dashicons-download’ where ‘dashicons’ is referred to use font and the icon font name is ‘download’ as my menu page is supposed to use a download icon. See this original output.

wp-dashicons

You can get the list of Dashicons from WordPress official page from this link.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.