I already have a child theme and a new style.css for it, but CSS changes in my child theme's style.css don't do anything because the parent theme's different CSS stylesheets come from a "CSS" folder. I was just told to 'enque a new style,'-- does this mean write a new @import rule?
What do I need to add to my child theme's style.css to make my CSS changes actually work?
I have tried including @import url("../parenttheme/style.css");
and @import url("..parenttheme/parentthemeCSSfolder/style.css");
-- neither worked.
UPDATE: After reading a bunch of threads and going through the codex more slowly, my functions.php now look like:
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'css parent', get_template_directory_uri() . '/css/style.css' );
wp_enqueue_style( 'css min', get_template_directory_uri() . '/css/style.min.css' );
wp_enqueue_style( 'css blue', get_template_directory_uri() . '/css/style-blue.css' );
wp_enqueue_style( 'css blue min', get_template_directory_uri() . '/css/style-blue.min.css' );
wp_enqueue_style( 'css green', get_template_directory_uri() . '/css/style-green.css' );
wp_enqueue_style( 'css green min', get_template_directory_uri() . '/css/style-green.min.css' );
wp_enqueue_style( 'css orange', get_template_directory_uri() . '/css/style-orange.css' );
wp_enqueue_style( 'css orange min', get_template_directory_uri() . '/css/style-orange.min.css' );
wp_enqueue_style( 'css violet', get_template_directory_uri() . '/css/style-violet.css' );
wp_enqueue_style( 'css violet min', get_template_directory_uri() . '/css/style-violet.min.css' );
wp_enqueue_style( 'css yellow', get_template_directory_uri() . '/css/style-yellow.css' );
wp_enqueue_style( 'css yellow min', get_template_directory_uri() . '/css/style-yellow.min.css' );
wp_enqueue_style( 'child-style',
get_stylesheet_directory_uri() . '/style.css',
array( 'parent-style' )
);
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
I still have not found a solution. The CSS changes I'm making in my child's style.css are overwritten (inspect element shows that they are applied but the parent theme's stylesheet is applied afterward). What am I doing wrong?