Child theme problema multiple CSS files
This support request was posted in Netelier by wrafico
- wrafico January 23, 2015 at 7:00 pm
Hello
I have created I child theme and I have tried many ways to be able to control the skin css style sheet but nothing that I tried has worked for me (only if I use important! on the css rule works) . I want to customize header background color.
Because now WP recommeds to use functions.php I really don-t know how is the right way of calling parent CSS . As you can see I’m using both ways but I think functions is not working .. stucked
In case you need acces to site please let me know and send you login.
FUNCTIONS.PHP
<?php
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '../netelier-2015/style.css' );wp_enqueue_style( 'parent-style', get_template_directory_uri() . '../netelier-2015/skins/grey.css' );
}
STYLE.CSS
Theme Name: netelier-2015-child
Theme URI: http://example.com/twenty-fifteen-child/
Description: NETELIER 2015 CHILD
Author: John Doe
Author URI: http://example.com
Template: netelier-2015
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain: netelier-2015-child
*/@import url("../netelier-2015/style.css");
@import url("../netelier-2015/skins/grey.css");#header {
background: #000 !important;
box-shadow: 100px 1px 2px 2px rgba(0,0,0,0.1);
}GREY.CSS
(I have tried creating a subfolder inside child folder and also in the main child folder, but no case, it grabs the parent skin/grey.css.)
/*
Theme Name: netelier-2015-child
Theme URI: http://example.com/twenty-fifteen-child/
Description: NETELIER 2015 CHILD
Author: John Doe
Author URI: http://example.com
Template: netelier-2015
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain: netelier-2015-child
*/@import url("../../netelier-2015/skins/grey.css");
#header {
background: none repeat scroll 0 0 #000;}This is the style that comes out form the parent theme
#header { background: #4a4e54; }Juanfra Aldasoro January 23, 2015 at 9:43 pmHello,
Thanks for writing. The usage of child themes is meant to be a solution when it comes to theme customisation without messing with the parent theme files.
Regarding the inclusion of the stylesheet through the functions.php file is redundant because you’ve already included the file through the styles.css of the child theme.
When you write:
@import url("../netelier-2015/style.css"); @import url("../netelier-2015/skins/grey.css");
You are already including those styles.
Finally, regarding to having your own styles for the grey skin, there’s no need to create a separate file. You can write the CSS rules directly on the styles.css file of the child theme. Perhaps, if you want to keep it organised you can add a “section”. Something like:
/*
Grey skin styles.
*/Best,
Juan.
You must be logged in to reply to this topic.