wp_enqueue_style for Plugin with multiple stylesheets

by

To answer your first question, you would use the second style, i.e.

function add_my_stylesheet() 
{
    wp_enqueue_style( 'myCSS', plugins_url( '/css/myCSS.css', __FILE__ ) );
    wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS1.css', __FILE__ ) );
}

add_action('admin_print_styles', 'add_my_stylesheet');

What the add_action() function does is tell WordPress, “When the admin_print_styles action occurs, run this add_my_stylesheet() function.” Confusingly, the practice of using the admin_print_styles and admin_enqueue_styles actions to enqueue stylesheets is incorrect – as counter-intuitive as it is, you should use admin_enqueue_scripts instead.

The calls to wp_enqueue_style() then add the specified stylesheets to a list of stylesheets that will be loaded (if you specify the dependencies argument, then WordPress will also take care of making sure that your stylesheets load in the correct order). You don’t need to “call” an enqueued stylesheet as you suggested – if it is enqueued, then it will be printed out in an HTML <link ...> element in the <head></head> section in the same manner that WordPress loads it’s own stylesheets.

In order to select which stylesheet will be loaded, you simply add your logic to your add_my_stylesheet() function; if you don’t wish for a stylesheet to be used, then you don’t enqueue it, i.e.:

function admincolorplugin_enqueue_styles() 
{
    // Get the user's stylesheet choice from the options, default to "white"
    $stylesheet = get_option( 'admincolorplugin_stylesheet', 'white' );

    // Conditionally load the appropriate stylesheet
    if( $stylesheet == 'black' ) {
        wp_enqueue_style( 'admincolorplugin-black', plugins_url( '/css/black.css', __FILE__ ) );
    }
    else {
        wp_enqueue_style( 'admincolorplugin-white', plugins_url( '/css/white.css', __FILE__ ) );
    }
}

add_action('admin_enqueue_scripts', 'admincolorplugin_enqueue_styles' );

Leave a Comment