How to use admin_enqueue_scripts action in WordPress

admin_enqueue_scripts action

The admin_enqueue_scripts hook stands out as a pivotal element in WordPress plugin and theme development. Its primary function is to enqueue JavaScript specifically on the backend pages of WordPress. Leveraging this hook is particularly advantageous when you aim to prevent a script from being included on all pages, offering a more targeted approach during the development of a WordPress plugin or theme backend.

To use admin_enqueue_scripts action, first you have to register it using add_action. You can write this code into functions.php of your activated theme or in a custom WordPress Plugin.

We at WePlugins always prefer to create a custom WordPress Plugin while using hooks so nothing breaks when you update your WordPress Theme in the future.

In the below live example, we have defined a function weplugins_execute_on_admin_enqueue_scripts_event which takes 1 parameter and we registered it using add_action. The first parameter admin_enqueue_scripts is the name of the hook, The second parameter weplugins_execute_on_admin_enqueue_scripts_event is the name of the function which needs to be called, third parameter is the priority of calling the hook if the same hook is used multiple times, and the last parameter is the number of arguments (if any) to be passed in the registered function.

Sometimes, you have to remove a registered hook so you can use remove_action to remove admin_enqueue_scripts action.

Parameters

Below the 1 parameter is required to use this hook.

• $hook_suffix : (string) The current admin page.

Live Example

Below is an example how you can use this hook.

    function weplugins_execute_on_admin_enqueue_scripts_event($hook_suffix){
        //You can write code here to be executed when this action occurs in WordPress. Use the parameters received in the function arguments & implement the required additional custom functionality according to your website requirements.
    }
    // add the action
    add_action( "admin_enqueue_scripts", "weplugins_execute_on_admin_enqueue_scripts_event" , 10, 1);
    

Load Custom Script Example

This implementation loads a custom JavaScript file specifically for the WordPress admin area. Note that this script will be loaded on all WordPress backend pages which is not a recommended way.

    function weplugins_load_custom_admin_script() {
        wp_enqueue_script('custom-admin-script', get_template_directory_uri() . '/js/admin-script.js', array('jquery'), '1.0', true);
    }
    add_action('admin_enqueue_scripts', 'weplugins_load_custom_admin_script');
    

Conditional Script Loading Example

This example demonstrates how to conditionally load a script only for a specific admin page.

    function weplugins_load_conditional_admin_script() {
        if (is_admin() && isset($_GET['page']) && $_GET['page'] === 'custom-admin-page') {
            wp_enqueue_script('conditional-admin-script', get_template_directory_uri() . '/js/conditional-script.js', array('jquery'), '1.0', true);
        }
    }
    add_action('admin_enqueue_scripts', 'weplugins_load_conditional_admin_script');
    

Load Script for Custom Post Type Example

Here’s how you can load a script specifically for a custom post type in the admin area.

    function weplugins_load_custom_post_type_styles() {
        global $post_type;
        if (is_admin() && $post_type === 'custom_post_type') {
            wp_enqueue_script('conditional-admin-script', get_template_directory_uri() . '/js/conditional-script.js', array('jquery'), '1.0', true);
        }
    }
    add_action('admin_enqueue_scripts', 'weplugins_load_custom_post_type_styles');
    

To remove a hook callback, use the example below.

    remove_action( "admin_enqueue_scripts", "weplugins_execute_on_admin_enqueue_scripts_event", 10, 1 );
    

Please make sure to provide the same callback function name, priority, and number of arguments while removing the hook callback.

Contact Us

If you need any customization or have any trouble using this hook, please contact our WordPress Development Team. We’d be happy to assist you.