Wordpress stylesheet child theme

2019-07-31 20:13发布

问题:

Actually my problem is that I already had a functional Child theme with a functions.php and many others filesname.php and also a style.css which work properly, but when I try to add an other stylesheet like for instance modules.min.css The theme is only reading it in the parent folder so I can't change stylesheets in my website and this is annoying

Some data: File in the parent folder I want to override: \wp-content\themes\startit\assets\css\modules.min.css

File in the child folder I want to be readable: \wp-content\themes\startit-child\assets\css\modules.min.css

I also tryed to put the modules.min.css right here in my child theme next to the styles.css but I can't override the parent folder \wp-content\themes\startit-child\modules.min.css

This is what look like my functions.php :

<?php
function startit_enqueue_styles() {

$parent_style = 'startit-style'; // This is 'twentyfifteen-style' for the Twenty Fifteen theme.

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 ),
    wp_get_theme()->get('Version')
);
}
add_action( 'wp_enqueue_scripts', 'startit_enqueue_styles' );

?>

Thank you !

回答1:

There are couple of ways to do that and the simplest one is:

  1. Remove/Dequeue Parent CSS file
  2. Add/Enqueue new CSS file

    function PREFIX_remove_scripts() {
       wp_dequeue_style( 'put_modules_file_handler_here' );
       wp_deregister_style( 'put_modules_file_handler_here' );
    
       // Now register your child CSS here, using wp_enqueue_style
    }
    add_action( 'wp_enqueue_scripts', 'PREFIX_remove_scripts', 20 );
    

Some Common Confusions Should you enqueue child styles as well as parent styles? Is it necessary? This is where a lot of confusion exists regarding enqueueing stylesheets in child themes. The answer depends on how the parent styles are included in the parent theme. For example, if the parent theme is using get_stylesheet_uri() to enqueue styles,

for example as in Twenty Sixteen:

wp_enqueue_style('twentysixteen-style', get_stylesheet_uri());

then you don't need to enqueue the child styles. This is because get_stylesheet_uri() returns the URL of the current active theme, which in this case is the child theme.

This is how URLs are returned, when working with child themes

get_stylesheet_uri()           = http://example.com/wp-content/themes/example-child/style.css
get_template_directory_uri()   = http://example.com/wp-content/themes/example-parent
get_stylesheet_directory_uri() = http://example.com/wp-content/themes/example-child

So, I would recommend you to check your parent functions.php and see, how the style is enqueued so you can handle it properly.



回答2:

// Add css file or js file
function activate_css() {
wp_enqueue_style('min_style_css',  get_template_directory_uri() .'assets/css/modules.min.css'));
));
}
//add css
add_action( 'init','activate_css');