Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialPaco Torres
8,450 PointsChanges on my child theme
I am making a new project and I've created and activated a child theme. When I look at Dashboard > Appearance > Editor everything seems to work properly, but when I make a change in my style.css nothing happens. I just can make changes directly on my parent theme. Any suggestion about what I am doing wrong?
Thank you very much.
8 Answers
Andrew McCormick
17,730 PointsYeah, this theme is not very kind to child themes out of the box.
I just downloaded it to look at what you were seeing.
The main stylesheet at topbest/style.css is blank other than the required theme information. The actual css is in the topbest/css/style.css . I've tried importing that url into the child theme, creating a stylesheet in the child theme folder to match: topbestchild/css/style.css (often when using the exact same structure the file will overridde the parent theme file), and a host of other things, but you're right that the style.css in the child theme just will not overwrite anything in the parent.
I use child themes all the time and haven't ran in to this before. Unless I'm missing something, this is just an example of bad theme design (of course, it is a free theme)
Zac Gordon
Treehouse Guest TeacherCan you post up a your CSS please.
When you make the changes via a text editor or from within admin area does it make a difference?
Paco Torres
8,450 PointsNo, it doesn't make a difference. The theme I am using has an style.css only with this:
/*
Theme Name: TopBest
Theme URI: http://themesmarts.com
Description: A Clean Design suitable for your company or personal portfolio.
Author: ThemeSmarts
Author URI: http://themesmarts.com
Version: 1.1
Copyright (C) 2012 ThemeSmarts
License: GNU General Public License, version 3 (GPLv3)
License URI: license.txt
*/
And there is a folder named 'css' which contains another style.css (with part of the rules) and more css documents. When doing the child theme I've wrote this:
/*
Theme Name: TopBest Child
Theme URI: http://themesmarts.com
Description: Child Theme for the TopBest theme.
Author: ThemeSmarts
Author URI: http://themesmarts.com
Template: topbest
Version: 1.1
Copyright (C) 2012 ThemeSmarts
License: GNU General Public License, version 3 (GPLv3)
License URI: license.txt
*/
@import "../topbest/style.css";
Thank you!
Paco Torres
8,450 PointsI find that when I make changes on 'topbest/style.css' nothing happens. So, I suppose that making changes on /topbestchild/syle.css' has the same effect.
This is the source code. I don't see anywhere the 'topbestchild' theme that is active.
<link rel='stylesheet' id='style-css' href='http://localhost/myweb.com/wp-content/themes/topbest/css/style.css?ver=3.8.1' type='text/css' media='all' />
<link rel='stylesheet' id='inner-css' href='http://localhost/myweb.com/wp-content/themes/topbest/css/inner.css?ver=3.8.1' type='text/css' media='all' />
<link rel='stylesheet' id='layout-css' href='http://localhost/myweb.com/wp-content/themes/topbest/css/layout.css?ver=3.8.1' type='text/css' media='all' />
<link rel='stylesheet' id='flexslider-css' href='http://localhost/myweb.com/wp-content/themes/topbest/css/flexslider.css?ver=3.8.1' type='text/css' media='all' />
<link rel='stylesheet' id='color-css' href='http://localhost/myweb.com/wp-content/themes/topbest/css/color.css?ver=3.8.1' type='text/css' media='all' />
<link rel='stylesheet' id='prettyphoto-css' href='http://localhost/myweb.com/wp-content/themes/topbest/css/prettyPhoto.css?ver=3.8.1' type='text/css' media='all' />
Zac Gordon
Treehouse Guest TeacherAll your changes should be going in /topbestchild/syle.css. You shouldn't be editing anything with from the parent theme.
Have you selected the child theme as your active theme from within the admin area?
If so, can you try doing something in your /topbestchild/syle.css like this:
body { background: black !important }
Just to check that something is having an effect.
Paco Torres
8,450 Points"Have you selected the child theme as your active theme from within the admin area?" Yes, I have.
Anything is having an effect. It is as if there were no child theme, but I can see it in Appearance > Editor: TopBest Child: Stylesheet (style.css)
I can only change the background color from the parent theme: /topbest/css/color.css.
I am beginning to think that the mistake is elsewhere.
Thank you again!
Paco Torres
8,450 PointsI have written this inside topbestchild/header.php:
<link rel='stylesheet' href='<?php echo get_stylesheet_directory_uri() ?>/style.css?ver=3.8.1' type='text/css' media='all' />
and it works!!
I have tried to load get_stylesheet_directory_uri() from functions.php, but I didn't success with this: wp_enqueue_style( 'style', get_stylesheet_directory_uri() . '/style.css', array());
Nevertheless, I think my solution is not very elegant.
Paco Torres
8,450 PointsThank you, Andrew. I appreciate what you have done and your words. I am happy to know that I am not the problem.