Can you see the <link rel="stylesheet"… tag added to the header of your site. If so, check the URL. Is it correct?
Thread Starter
VM06
(@vm06)
Thanks for your quick answer :).
Yes I see it loaded : <link rel=’stylesheet’ id=’css_perso-css’ href=’http://wordpress-doc/wp-content/plugins/plugin_perso/plugin_perso_css/css_perso.css?ver=4.9.7′ type=’text/css’ media=’all’ />.
The URL is correct but it is not the last which is loaded (there are 6 other stylesheets that are loaded after
Thread Starter
VM06
(@vm06)
Yes, I think this is the problem because I have just added “!important” on my stylesheet and this is OK.
So how can I do to have this loaded lastly?
Do I have to add a dependency?
And just another thing : I am used to create child themes and add my functions code on my child theme functions.php. How do I do with a specific plugin to add my functions?
Thanks.
Hi there,
find out the id of the last css file that should be loaded right before your plugin css file. Let’s say the id of this file (if it is loaded by wp_enqueue_style too) is ‘my-css-file-id’.
Add this id as a dependency to wp_register_style:
wp_register_style('css_perso', plugin_dir_url( __FILE__).'plugin_perso/plugin_perso_css/css_perso.css', array('my-css-file-id'));
wp_register_style accepts an array with dependencies after the src.
When it comes to the functions.php: your plugin itself is the functions.php in this case! The php file of the plugin can be used similar to the functions.php – so to say.
Thread Starter
VM06
(@vm06)
Thanks for you answer. I tried this code replacing the id but this does not work. The file does not load now.
function wpb_adding_styles() {
wp_register_style('css_perso', plugin_dir_url( __FILE__).'plugin_perso_css/css_perso.css', array('wiki-style-css'));
wp_enqueue_style('css_perso');
}
add_action('wp_enqueue_scripts','wpb_adding_styles');
Thread Starter
VM06
(@vm06)
It is OK, I have just added a higher priority on add_action and this works perfectly.
Thanks.
The actual handle of the stylesheet will exclude the -css part. So try just using wiki-style. It’s important to keep in mind though that this is telling WordPress that your stylesheet depends on wiki-style. One thing this does is ensure that your stylesheet loads after wiki-style, but it also means that if wiki-style doesn’t load then neither will your stylesheet. This can happen if the plugin that loads those styles is deactivated, or if that plugin only conditionally loads styles on certain pages.
In a situation where the purpose of your stylesheet is to overwrite a theme’s stylesheet styles you should set the dependency to be the theme’s stylesheet. The handle for that should be the theme’s folder name.
A simpler way to load a stylesheet later is to set a higher priority for add_action(). The 3rd argument of add_action() is essentially the order that the hooks should occur. The default is 10, so using something like 99 will enqueue your stylesheet later than others:
add_action('wp_enqueue_scripts','wpb_adding_styles', 99);
Aside from the order that stylesheets are loading the important thing to do is to make sure that your CSS rules are more specific than the ones you are trying to overwrite. Read about Specificity in CSS here.
Thread Starter
VM06
(@vm06)
Hello @jakept,
Thanks for your complete answer. I did not see it as I did not receive any notification.
So, the way I added the stylesheet is correct? Or do I need to set a dependency (sorry but I did not understand everything)?
And another question please : I have to change the code of some of the theme files (like header.php, footer.php…). I know how to do when we create a child theme but not when we create a plugin to make modifications. How do we do with a plugin? Is it better to create a child theme to override those files and make the necessary modifications?
Thanks 🙂 .
