9

How do I enqueue a .css file before style.css is loaded? Or make the default style.css dependant on another .css file?

I'm trying to load a .css reset, which style.css would overwrite.

Here's what I have:

add_action('wp_enqueue_scripts', 'load_css_files');

function load_css_files() {
    wp_register_style( 'normalize', get_template_directory_uri() . '/css/normalize.css');
    wp_enqueue_style( 'normalize' );
}

However this is loaded after style.css.

12

Enqueue the style.css too, and set normalize as dependency:

if ( ! is_admin() )
{
    // Register early, so no on else can reserve that handle
    add_action( 'wp_loaded', function()
    {
        wp_register_style(
            'normalize',
            // parent theme
            get_template_directory_uri() . '/css/normalize.css'
        );
        wp_register_style(
            'theme_name',
            // current theme, might be the child theme
            get_stylesheet_uri(), [ 'normalize' ]
        );
    });
    add_action( 'wp_enqueue_scripts', function()
    {
        wp_enqueue_style( 'theme_name' );
    });
}

WordPress will load the dependencies now first automatically when theme_name is printed.

  • 1
    Great, thanks! Just a quick question - do I then not need to enqueue the normalize style, or is this done automatically when set as a dependency? – vonholmes Apr 17 '13 at 11:51
  • Automatically enqueued when called as a dependency. – RRikesh Apr 17 '13 at 11:52
  • @vonholmes I have added that to my answer. – fuxia Apr 17 '13 at 11:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.