0

I'm trying to setup my child theme style sheet with a premium theme I have bought but I'm having a nightmare trying to get to work properly and efficiently.

I have downloaded the theme's child theme template from their website and some of my child theme code works as normal. However, I have noticed that inline code (Theme Customise under WordPress Dashboard) takes precedence over the child style sheets. This is probably normal behavior, but my only way to allow the child theme code to come through without the inline code kicking is to open the theme's customiser and set the values to simply nothing. Even though this works allowing my child theme to work, surely having broken code with CSS properties that has no setting set is unethical coding??

My child theme has a main 'Styles.css' file and additional style sheets named under 'Extra Styles'. I would like these extra styles to be higher priority than the child, so if there is code it will be applied but if not, it will then look to the child style sheet.

In simple terms I would like WP to hierarchically check my style sheets in order, so if there is no code in the first one it will go onto the next one and so forth. The order I would like is the following:- Extra Styles > Child theme > Inline theme (Theme Customise) > Parent theme

The code below is the from my original 'functions.php' file that I used for a while. My child theme code worked very well but the Theme Customise panel barely functioned and my child style sheet did duplicate itself after checking with web browser developer tools.

<?php
//
//Child theme integration
//
function child_theme_styles() {
    $parent_style = 'sydney-pro-ii';
    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 ));
}
function extra_styles() {
    wp_enqueue_style( 'Main', get_stylesheet_directory_uri() . '/CSS/main.css'); //Main CSS
    wp_enqueue_style( 'Extra_1', get_stylesheet_directory_uri() . '/CSS/extra_1.css'); //Extra CSS
    wp_enqueue_style( 'blog', get_stylesheet_directory_uri() . '/CSS/blog-archive.css'); //Blog CSS
    wp_enqueue_style( 'Fonts', get_stylesheet_directory_uri() . '/CSS/Fonts.css'); //Fonts CSS    
}
add_action( 'wp_enqueue_scripts', 'child_theme_styles', PHP_INT_MAX);
add_action( 'wp_enqueue_scripts', 'extra_styles', 11 );
?>

This is the child theme template 'functions.php' file provided by the theme makers:-

<?php
/**
* Sydney child functions
*
*/




/**
* Enqueues the parent stylesheet. Do not remove this function.
*
*/
add_action( 'wp_enqueue_scripts', 'sydney_pro_child_enqueue' );
function sydney_pro_child_enqueue() {

    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );


}


/* ADD YOUR CUSTOM FUNCTIONS BELOW */

This is the child theme template 'functions.php' file provided by the theme makers:-

/*
Theme Name: Sydney Pro Child
Theme URI: http://athemes.com/theme/sydney
Author: aThemes
Author URI: http://athemes.com
Template: sydney-pro-ii
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sydney
*/

Could someone please help me out here please? I have asked on multiple forums in the past before including the official WP forum, the athemes forums, I even looked at the WP Code Reference and have fiddled around with the 'functions.php' myself and I'm not getting any luck.

Many thanks

Will

  • Inline CSS has higher specificity. To override it, you need to write CSS with even higher specificity - which may in some cases require the use of !important. Although that's not ideal, using !important is probably better than leaving empty properties. – WebElaine Feb 14 at 17:06
0

There's nothing wrong with leaving it all alone and only using the custom CSS in the customizer. In fact it's a better way to do it since it will allow you to add the style you want, at the level you want and override the base styles provided in the theme and child themes.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.