Enqueueing child themes
-
In my child theme, I am enqueueing the parent and child themes like this:
function mychildtheme_enqueue_styles() {
// $parent_style = ‘parent-style’;wp_enqueue_style( ‘parent-style’, get_template_directory_uri() . ‘/style.css’ );
wp_enqueue_style( ‘child-style’,
get_stylesheet_directory_uri() . ‘/style.css’,
array( ‘parent-style’ )
);}
add_action( ‘wp_enqueue_scripts’, ‘mychildtheme_enqueue_styles’);`This is based on documentation I find on how to enqueue a child theme style.css for twentyseventeen.
However, in twentyseventeen functions.php, it enqueues style.css with this call:
wp_enqueue_style( ‘twentyseventeen-style’, get_stylesheet_uri(), array(), ‘20201208’ );
It uses get_stylesheet_uri() which returns the url of the active theme, which when I have my child them active is the url of my child theme, not twentyseventeen. So that call is loading style.css from my child theme and not from twentyseventeen. So since my style.css is already enqueued by twentyseventeen’s functions.php, is there a need for me to enqueue it again in my child theme’s functions.php?
My functions.php is called first and then twentyseventeen’s functions.php is called. So currently my functions.php enqueues twentyseventeens’s style.css and my child theme’s style.css, and then twentyseventeen’s functions.php enqueues my child theme’s style.css again.
So when I look at the resulting html source code generated, I see that my child theme style.css is referenced twice.
So I modified my functions.php to only enqueue the twentyseventeen style.css by changing my enqueue call to this:
`function hjmagtheme_enqueue_styles() {
// $parent_style = ‘parent-style’;wp_enqueue_style( ‘parent-style’, get_template_directory_uri() . ‘/style.css’ );
}
add_action( ‘wp_enqueue_scripts’, ‘hjmagtheme_enqueue_styles’);I see my web pages rendering the way I want with my style.css overriding twenty seventeen’s style.css, and I see both twentyseventeen style.css and my child theme’s style.css referenced just once in the html generated for my pages, with the twentyseventeen style.css loading first and my child theme style.css loading after so that it overrides the twentyseventeen style.css the way it is supposed to.
Is this what I should be doing? Or am I missing something here?
- The topic ‘Enqueueing child themes’ is closed to new replies.