I created a child theme and it doesn't work for some of the css files

Question

I have a template with 4 css files: rtl.css, style.css, main.css, bootstrap.css.

rtl.css and style.css are located in my template root, for example: my_template_root/style.css.

main.css and bootstrap.css are located, for example: my_template_root/assets/stylesheet/main.css

functions.php code is:

add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_directory_directory_uri() . 'style.css' );
}

This functions.php code apply correctly only for rtl.css and style.css but my changes in main.css and bootstrap.css don't work anyway.

Answer 1

You are calling your css files with wrong function like in following line of your code

wp_enqueue_style( 'parent-style', get_directory_directory_uri() . 'style.css' );

You are using get_directory_directory_uri() function to call files which is not event a function in wordpress.

Files must be called with one of the following two functions

1. get_stylesheeet_directory_uri() : This function will search files in your active theme's folder. By active theme means, theme that is activated by user from dashboard -> appearace -> theme. In your case child theme is active, so it will search file in your child theme folder.

2. get_template_directory_uri() : This function will search files in your parent theme's folder.

If your files are present in child theme's folder then add this code in functions.php to call your css files

add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' ); 
function my_theme_enqueue_styles() { 
    wp_enqueue_style( 'parent-style', get_stylesheet_uri() );   //It will call your style.css file
    wp_enqueue_style( 'style1', get_stylesheeet_directory_uri() . '/rtl.css' );
    wp_enqueue_style( 'style2', get_stylesheeet_directory_uri() . '/assets/stylesheet/main.css' ); 
    wp_enqueue_style( 'style3', get_stylesheeet_directory_uri() . '/assets/stylesheet/bootstrap.css' ); 
}

In the above code parent-style, style1,style2,style1 are the user assign name and that name must be unique. And in one line only one file will be called, so if you wanna call 4 files then you have to specify path of all files in different lines.

Note: If your files are present in Parent theme's then you need to replace get_stylesheeet_directory_uri with get_template_directory_uri in above code.

For more detail read this article.

Answer 2

Assuming that your css files are correctly uploaded to your server, the most likely cause for the changes not showing up, is that your browser caches the files. Reloading with ctrl-F5 might do the trick.

Another way to force the browser to reload all style sheets would be to attach a version number to it. The version is in the header of style.css. You can append it to all stylesheets like this:

$theme_data = wp_get_theme();
wp_enqueue_style('style1', get_template_directory_uri() . '/style1.css', '', $theme_data['version'], false);
wp_enqueue_style('style2', get_template_directory_uri() . '/style2.css', '', $theme_data['version'], false);
... and so on ...

Every time you change the version in style.css the browser will think all stylesheets have a new version and reload them