WordPress Admin Dashboard Call and Disable Dashicons Font Icon Methods

Hello everyone, I am Brother Lei Feng. Sometimes when helping others write WordPress backend features, you need to add icons to the function menu. Here, I'll teach you how to reference Dashicons font icons, so you don't need to separately reference other icon files. Since WordPress 3.8, the admin menu in the backend has supported Dashicons font icons. As Theme or Plugin developers, we should keep up with the times.

About Dashicons

Dashicons is an open-source font icon project, currently hosted onGitHub, and is mainly used in the WordPress backend. Of course, you can also use it in your own Theme or Plugin. View Dashicons font icons:https://developer.wordpress.org/resource/dashicons/

How to use?

Using Dashicons in Custom Post TypesIf we use ‚dashicons-images-alt2‘ as the menu icon, the relevant code should be as follows:

register_post_type('slides', array( 'labels' => array( 'name' => 'Slides', 'singular_name' => 'Slide' ), 'public' => true, 'has_archive' => true, 'menu_icon' => 'dashicons-images-alt2' ) );

Using Dashicons in Plugin Top-Level MenusYou can also use Dashicons when creating plugin menus, for example, adding a top-level menu using the add_menu_page() function as shown below:

add_menu_page( 'Menu Page Title', 'Menu Title', 'manage_options', 'menu-slug', 'mytheme_menu_callback', 'dashicons-wordpress' // Dashicon 图标的CSS类 );

The two code examples above are relatively common, while other positions are rarely used.

Disable Dashicons

Conversely, if you do not want Dashicons to load in the admin dashboard, you can disable them to reduce the loading of approximately 30kb of style files and improve backend speed. Open the theme's functions.php file and add the following code:

// remove dashicons
function wpdocs_dequeue_dashicon() {
if (current_user_can( 'update_core' )) {
return;
}
wp_deregister_style('dashicons');
}
add_action( 'wp_enqueue_scripts', 'wpdocs_dequeue_dashicon' );

Note: If your theme uses Dashicons, it is not recommended to disable them, as this may cause icons not to display or become misaligned.Other recommended articles:

• How to Add Icons to WordPress Website Navigation Menu_iconfont_Font Awesome