Load js/css files only on specific admin UI pages

How do I adapt this solution to work with my plugin? (Please see the link).

I enqueue my css and js script as follows:

Read More
function my_plugin_init() {
 wp_enqueue_script('my_plugin_script', plugins_url('js/the_filepath.js', __FILE__), array('jquery'));
 wp_enqueue_style( 'my_plugin_css', plugins_url( '/css/the_filepath.css', __FILE__ ) );
}

add_action('init', 'my_plugin_init');

I tried putting this in the theme’s functions.php, but it didn’t work:

function remove_my_plugin_extras() {
    remove_action('init', 'my_plugin_init');
}

if( !is_page('My_Page') ) {
    add_action('wp_head', 'remove_my_plugin_extras');
}

The script and css still loaded. How do I adapt the solution in this case?

Related posts

Leave a Reply

2 comments

  1. The right hooks

        // Use both for scripts & styles *)
        wp_enqueue_scripts // (for the frontend)
        login_enqueue_scripts // (for the login screen)
        admin_enqueue_scripts // (for the admin dashboard)
    

    *) Read this article @wpdevel.

    Further reading in the Codex about the three hooks

    On the admin_enqueue_scripts hook, you have an argument as well: The $hook_suffix:

    add_action( 'admin_enqueue_scripts', function( $hook )
    {
        var_dump( $hook );
    } );
    

    Admin page hooks

    When registering a admin (sub)menu page, you can save the result, which is the page hook, into a variable:

    function register_admin_page()
    {
        // Register (sub)menu page
        $hook_suffix = add_submenu_page( $your_args_array );
        // Add styles to hook
        add_action( "load-{$hook_suffix}", 'callback_function' );
    }
    // Use one of those hooks to register the page
    add_action( 'admin_menu', 'register_admin_page' );
    add_action( 'user_admin_menu', 'register_admin_page' );
    add_action( 'network_admin_menu', 'register_admin_page' );
    
    // Register your styles & scripts in here
    function callback_function()
    {
        // do stuff
    }
    

    Admin globally available variables to check against

    The following

    global $hook_suffix, $typenow, $pagenow, $self, $parent_file, $submenu_file
    

    are available on a wide range of admin pages. Use them to check if you’re on the requested page that you need and only then do stuff.

    // Example
    if ( 'edit.php' !== $GLOBALS['pagenow'] )
        return;
    

    Even better than testing against a variable, which can get reset on the fly (example) …

    $GLOBALS['wp'] = array( 'lost', 'my', 'contents', );
    

    … is using the WP_Screen object on admin pages:

    add_action( 'admin_enqueue_scripts', function( $hook )
    {
        /** @var WP_Screen $screen */
        $screen = get_current_screen();
    
        var_dump( $screen );
        if ( 'post.php' !== $screen->base )
            return;
    } );
    
  2. function load_custom_wp_admin_style($hook) {
            // $hook is string value given add_menu_page function.
            if($hook != 'toplevel_page_mypluginname') {
                    return;
            }
            wp_enqueue_style( 'custom_wp_admin_css', plugins_url('admin-style.css', __FILE__) );
    }
    add_action( 'admin_enqueue_scripts', 'load_custom_wp_admin_style' );