I have successfully created a child theme for the Emmet Lite template
, using the information provided on here and here
The CSS file of the child theme looks like this:
/*
Theme name: Emmet Child
Theme URI: http://www.example.com/
Description: This is a child of Emmet Lite theme
Author: Motopress
Author URI: http://www.getmotopress.com/
Template: emmet-lite
Version: 1.0
*/
/* Adjustments to the Emmet Lite template start here */
.top-header {
display: none;
}
.site-header {
background-color: #FFC421;
}
I firstly added the @import
function, but that didn't work for me. What I read is that the parent css was loaded after the child, so the last one wins.
To counter this I added a functions.php
to my child folder and removed the @import
. This looks like this:
<?php
function my_theme_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', 'my_theme_enqueue_styles' );
?>
So all is working correctly, the changes/overrides I made inside the style.css
of the child folder are correctly applied on my website.
Understanding the situation:
My question is:
The parent Emmet
theme uses CSS files called differently than style.css
. The names used by this template are ...
- emmet-style.min.css
- emmet-style.css
(They are located in the theme folder, path: emmet-lite/css/emmet-style.css)
It includes also a set of other styles for Woocommerce, Buddypress, Bootstrap, but the only file I use for editing is emmet-style.min.css.
I would like to understand what I'm doing here, even if it already works. I'm not into PHP, so from my understanding this line of code calls a wrong CSS but still works?
wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
The style.css should be emmet-style.min.css
or is it always style.css
no matter what? I don't see anything mentioned in the documentation when developing a functions.php
which mentions to change the style.css
path to the correct CSS path. So I probably misunderstand the PHP here.
Can somebody help me explain more in-depth what is going on inside the functions.php
for child themes and the paths given ?