Child CSS error

[coratees]

Hi,

Been trying to ass CSS to the Child theme, can’t seem to get it to work. My site is as below:

I’ve added basic css to change the footer colour, it works when I add it to the global css, but not when it’s in Child.

Any help appreciated!

[thai]

Hello There,

Please keep in mind that the smaller the number, the more priority is the function. In your case, it is still not taking effect because of the style hierarchy. This is the order of the styles being loaded in the theme:

Stack style (theme's stack style)
Child theme style
WordPress Additional CSS
Theme Option Settings
Theme Options's custom css
Cornerstone page custom css

Hope this helps

[coratees]

Thanks for the speedy reply. How do I go about changing the style hierarchy so that Child is loaded last?

Thanks

[thai]

Hi There,

You need to setup a child theme first:

Child Themes | Themeco Docs

After that add this custom code under functions.php file locates in your child theme:

function x_deregister_child_style(){
	if ( is_child_theme() ) {
		wp_deregister_style( 'x-child' );
	}
}
add_action( 'wp_enqueue_scripts', 'x_deregister_child_style', 9999 );

function x_re_enqueue_child_style(){
	if ( is_child_theme() && apply_filters( 'x_enqueue_parent_stylesheet', false ) ) {
		?>
		<link rel='stylesheet' id='x-child-css'  href='<?php echo get_stylesheet_directory_uri(); ?>/style.css?ver=<?php echo X_VERSION; ?>' type='text/css' media='all' />
		<?php
	}
}
add_action( 'wp_head', 'x_re_enqueue_child_style', 99999 );

Please note that custom coding is outside the scope of our support. Issues that might arise from the use of custom code and further enhancements should be directed to a third party developer.

Hope that helps and thank you for understanding.

[coratees]

Hello,

I had the Child theme set up, but didn’t have the custom code. I’ve added it to functions.php, but the Css in style.css is still being ignored.

Anything else I should try?

[christian]

Upon checking, your child theme’s CSS is now loaded after the Theme Option’s CSS and your custom CSS overriding the footer background works.

Please clear your browser’s cache and test again. Also test in incognito mode and other browsers.

Thanks.

[coratees]

Thanks for that, working now. Thank you for the help!

[christian]

You’re welcome.