Child Theme CSS

JamesBartley

Hi,

I'm using the Child Theme and want to override a CSS setting.

I've done some research around how the CSS enqueueing works and it seems that the child theme should enqueue all the CSS files from the parent style first, before enqueueing the child CSS file(s). This way the child css is loaded after the parent, and overrides the settings.

At the moment your child theme functions.php doesn't do this, and so changes made to the style.css of the child theme do not overwrite the parent theme.

Can you please update the functions.php file of the child theme to enqueue all parent css files before the child theme css.

Thank you.

JamesBartley

To assist, here is an example of the enqueue styles section from my current adaptation of the child functions.php.  This only loads what seem to be the main 4 styles (as this is all I want to current override) however it would be useful if the child theme provided was correctly configured for all stylesheets used in the main theme.

/* ---------------------------------------------------------------------------

 * Enqueue Style

 * --------------------------------------------------------------------------- */

add_action( 'wp_enqueue_scripts', 'mfnch_enqueue_styles', 101 );

function mfnch_enqueue_styles() {

// Enqueue the parent stylesheets

wp_enqueue_style( 'style', get_template_directory_uri(), false, THEME_VERSION, 'all' );

wp_enqueue_style( 'mfn-base', get_template_directory_uri().'/css/base.css', false, THEME_VERSION, 'all' );

wp_enqueue_style( 'mfn-layout', get_template_directory_uri().'/css/layout.css', false, THEME_VERSION, 'all' );

wp_enqueue_style( 'mfn-shortcodes', get_template_directory_uri().'/css/shortcodes.css', false, THEME_VERSION, 'all' );

// Enqueue the parent rtl stylesheet

if ( is_rtl() ) {

wp_enqueue_style( 'mfn-rtl', get_template_directory_uri() . '/rtl.css' );

}

// Enqueue the child stylesheet

wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() .'/style.css', array('style','mfn-base','mfn-layout','mfn-shortcodes') );

}

Bryan

Hi,

We will think about it, the enqueue stays the same in a child theme, this only creates a way to override parent css.

thanks for the insight.

Learn more: Video Tutorials | How To | FAQ Vote on what comes next