do_action( 'admin_enqueue_scripts', string $hook_suffix )
Enqueue scripts for all admin pages.
Description Description
Parameters Parameters
- $hook_suffix
-
(string) The current admin page.
Source Source
Changelog Changelog
| Version | Description |
|---|---|
| 2.8.0 | Introduced. |
User Contributed Notes User Contributed Notes
You must log in before being able to contribute a note or feedback.
Selectively enqueue a script in the admin
The admin_enqueue_scripts action hook can also be used to target a specific admin page. In this example we are loading a javascript file in the head section of edit.php.
/** * Enqueue a script in the WordPress admin, excluding edit.php. * * @param int $hook Hook suffix for the current admin page. */ function wpdocs_selectively_enqueue_admin_script( $hook ) { if ( 'edit.php' != $hook ) { return; } wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'myscript.js', array(), '1.0' ); } add_action( 'admin_enqueue_scripts', 'wpdocs_selectively_enqueue_admin_script' );Figure out your $hook name
If you are unsure what the $hook name of the current admin page of which you want to conditionally load your script is, add this to your page:
Enqueue a custom stylesheet in the admin
Sometimes you want to load a set of CSS and/or Javascript documents to all admin pages. You can do this from within your plugin or from your themes function file:
/** * Register and enqueue a custom stylesheet in the WordPress admin. */ function wpdocs_enqueue_custom_admin_style() { wp_register_style( 'custom_wp_admin_css', get_template_directory_uri() . '/admin-style.css', false, '1.0.0' ); wp_enqueue_style( 'custom_wp_admin_css' ); } add_action( 'admin_enqueue_scripts', 'wpdocs_enqueue_custom_admin_style' );Another way to load scripts or css in specific admin page by using this function
In this example, we are loading a javascript and a css file in the head section of nav-menus.php page.
function add_script_to_menu_page() { // $pagenow, is a global variable referring to the filename of the current page, // such as ‘admin.php’, ‘post-new.php’ global $pagenow; if ($pagenow != 'nav-menus.php') { return; } // loading css wp_register_style( 'some-css', get_template_directory_uri() . '/css/some.css', false, '1.0.0' ); wp_enqueue_style( 'some-css' ); // loading js wp_register_script( 'some-js', get_template_directory_uri().'/js/some.js', array('jquery-core'), false, true ); wp_enqueue_script( 'some-js' ); } add_action( 'admin_enqueue_scripts', 'add_script_to_menu_page' );Expand full source codeCollapse full source code
Load css and js only on a particular sub-menu page
// custom css and js add_action('admin_enqueue_scripts', 'cstm_css_and_js'); function cstm_css_and_js($hook) { // your-slug => The slug name to refer to this menu used in "add_submenu_page" // tools_page => refers to Tools top menu, so it's a Tools' sub-menu page if ( 'tools_page_your-slug' != $hook ) { return; } wp_enqueue_style('boot_css', plugins_url('inc/bootstrap.css',__FILE__ )); wp_enqueue_script('boot_js', plugins_url('inc/bootstrap.js',__FILE__ )); }