WordPress: How to override all default theme CSS so your custom one is loaded the last?

1 Views

I have a problem where I’ve been able to include a custom css in the section of my wordpress theme with the following code: 

function load_my_style_wp_enqueue_scripts()
{
wp_register_style('my_styles_css', includes_url("/css/my_styles.css"));
wp_enqueue_style('my_styles_css');
}
add_action('wp_enqueue_scripts','load_my_style_wp_enqueue_scripts');

But the order in the source code is as follows:

Read More
<link rel='stylesheet' id='my_styles_css-css'  href='http://...folderA.../my_styles.css?ver=3.1' type='text/css' media='all' />
<link rel="stylesheet" id="default-css" href="http://...folderB.../default.css" type="text/css" media="screen,projection" />
<link rel="stylesheet" id="user-css" href="http://...folderC.../user.css" type="text/css" media="screen,projection" />

I want my_styles_css to be the last file to load, overriding default and user files. I’ve tried to achieve this by modifying wp_enqueue_style in different ways, but without any success. I’ve tried: 

wp_enqueue_style('my_styles_css', array('default','user'));

or 

wp_enqueue_style('my_styles_css', false, array('default','user'), '1.0', 'all');

I’ve seen some related questions without answer or with these last 2 methods that are still failing for me.

The function above is part of a plugin that I’ve got enabled in my wordpress installation.

Post Views: 1

Related posts

Leave a Reply

4 comments

  1. The add_action function has a priority parameter that might help:

    $priority
    (int) (optional) How important your function is. Alter this to make your function be called before or after other functions. The default is 10, so (for example) setting it to 5 would make it run earlier and setting it to 12 would make it run later.
    Default: 10

    http://codex.wordpress.org/Function_Reference/add_action

    Or you could directly link to your css in your header.php file rather than using wp_enqueue_style, and therefore place it exactly where you want.

    Otherwise there seems to be an answer here: How to force wp_enqueue_style to display CSS at the very bottom of the head tag to override all CSS rules?

  2. The correct way to add a stylesheet to your theme is by way of the wp_enqueue_style() function:

    wp_enqueue_style( $handle, $src, $deps, $ver, $media );

    With $deps you specify which stylesheets should be loaded before your custom stylesheet.