Child theme stylesheet priority

Huluti commented 3 years ago

HI! I've an issue with the theme which I've managed to fix by myself but it could help you to fix this problem.

For my CSS rules in my custom stylesheet of my child theme to be applied I've to dequeue the flexia CSS to readd it after with the good dependence:

function child_enqueue_styles() {
    $parent_style = 'flexia-theme-style';
    wp_dequeue_style($parent_style);
    wp_enqueue_style($parent_style, get_template_directory_uri() . '/framework/assets/site/css/style.css');
    wp_enqueue_style('child-style', get_stylesheet_directory_uri() . '/style.css', array( $parent_style ), FLEXIA_CHILD_INFLUXE_VERSION, 'all');
}
add_action( 'wp_enqueue_scripts', 'child_enqueue_styles' );

jamilbd07 commented 3 years ago

Hi @Huluti , Thanks for your advise. But can you please share the problem you have faced with our child theme?

Huluti commented 3 years ago

Hi @jamilbd07. In fact, with the provided child theme each CSS rule that I wanted to applied must be provided with !important.

It's because the flexia stylesheet was loaded after the child theme. With my code it displace the flexia parent style before the call to the child theme stylesheet:

Before:

<link rel='stylesheet' id='child-style-css'  href='https://localhost/wp-content/themes/site/style.css?ver=1.0.0' type='text/css' media='all' />
<link rel='stylesheet' id='flexia-theme-style-css'  href='https://localhost/wp-content/themes/flexia/framework/assets/site/css/style.css?ver=5.5.3' type='text/css' media='all' />

After:

<link rel='stylesheet' id='flexia-theme-style-css'  href='https://localhost/wp-content/themes/flexia/framework/assets/site/css/style.css?ver=5.5.3' type='text/css' media='all' />
<link rel='stylesheet' id='child-style-css'  href='https://localhost/wp-content/themes/site/style.css?ver=1.0.0' type='text/css' media='all' />

It's the first time with a theme that I must do this trick (with wp_dequeue_style and wp_enqueue_style) to have my rules correctly applied.

jamilbd07 commented 3 years ago

@Huluti , thanks for finding this out. You are awesome!

Huluti commented 3 years ago

@jamilbd07 So you've found the cause of this problem?

jamilbd07 commented 3 years ago

@Huluti Actually this issue was never issued before that's why we didn't figure this out. But thank you for finding this issue and solve the issue for us.

rupok / flexia

Child theme stylesheet priority #42