Archived topic
Style Sheet Dependencies: forcing child theme CSS to load after others
8 replies · Started by Jeff on October 14, 2021
I'm working with an under-construction site, so I can't give URL just now. But...
I want the styles.css file in my child theme to load AFTER various others.
I'm using the $deps parameter within wp_enqueue_style(), but it's not working. I use and have used this approach often (successfully) with other themes.
[I'm not trying to add a second topic to one post, but this seems related:]
Trying to debug this issue, I created a simple CSS file (nwb.css) with one rule in the child folder.
I added the wp_enqueue_style() code to functions.php in my child folder. Uploaded. Refreshed browser.
This new CSS file isn't listed anywhere in view-source.
Look forward to your help.
Hi there,
can you share the enqueue function you're using ?
I have simplified things for diagnostic purposes.
This is currently in the child theme folder's functions.php:
add_action( 'wp_enqueue_scripts', 'nwb_enqueue_styles' );
function nwb_enqueue_styles() {
$deps = array(
'generate-style'
);
wp_enqueue_style( 'jeff-styles', get_stylesheet_directory_uri() . '/nwb.css', $deps );
}
It's not working. The jeff-styles stylesheet appears above generate-style.
You can see it in action here:
https://willpowerengineering.com/test/
Try the method that Tom provides here:
https://generatepress.com/forums/topic/how-to-deactivate-default-styles/#post-1676329
Here's my functions.php:
add_action( 'wp_enqueue_scripts', function() {
wp_dequeue_style( 'generate-child' );
wp_enqueue_style( 'generate-child' );
}, 500 );
add_action( 'wp_enqueue_scripts', 'nwb_enqueue_styles' );
function nwb_enqueue_styles() {
$deps = array(
'generate-style'
);
wp_enqueue_style( 'jeff-custom-styles', get_stylesheet_directory_uri() . '/nwb.css', $deps );
}
And here's a snapshot of the view-source, which you can see yourself from the link in my previous post:
<link rel='stylesheet' id='jeff-custom-styles-css'
<link rel='stylesheet' id='tablepress-default-css'
<link rel='stylesheet' id='font-awesome-official-css
<link rel='stylesheet' id='generate-child-css' href
<link rel='stylesheet' id='font-awesome-official-v4s
<style id='font-awesome-official-v4shim-inline-css'>
By the way, when I removed 'generate-child' from the $deps array (making it empty), the result is similar; i.e., 'generate-child' loads after.
Sorry .. i completely jumped the gun there, i should have looked to see this was a separate styles sheet to the child themes styles. So you don't need Tom's code.
Try just increasing the priority of your wp_enqueue_scripts eg.
add_action( 'wp_enqueue_scripts', 'nwb_enqueue_styles', 500 );
function nwb_enqueue_styles() {
$deps = array(
'generate-style'
);
wp_enqueue_style( 'jeff-custom-styles', get_stylesheet_directory_uri() . '/nwb.css', $deps );
}
And you shouldn't require dependencies.
Dang. (What's the emoticon for 'embarrassed'?)
Basic WordPress 101.
Sorry I even bothered you.
Thanks much.
No problems - glad to be of help :)