That’s not how you override the style of a parent theme. As covered in http://codex.wordpress.org/Child_Themes, you want to 1) create a new theme directory, 2) create a style.css like below, 3) include whatever new/override styles you want. The Template: line names the directory of the parent, and the @import line brings in the parent’s stylesheet.
/*
Theme Name: Twenty Ten Child
Description: Child theme for the Twenty Ten theme
Author: Your name here
Template: twentyten
*/
@import url("../twentyten/style.css"); /* this is !important; */
Yes, thanks, I did all that at the outset.
The php above is in the header.php and should be using the child’s styles.css unless the page is that specific one. The child theme is working fine apart from the fact that it will not switch css stylesheet for that particular page.
Ah, sorry about that.
If you aren’t getting the alternate CSS file then is_page('News') must be returning false. I know this is a ‘Duh!’ kind of statement, but it helps focus on what you need to determine/fix.
I notice that the info in the title tag is different for this page than your other pages. Since this is the information the is_page() function is checking …?
Another possibility is that you might have an extra space at the end of the title. Most systems I build automatically strip leading/trailing spaces, but I just checked and found WordPress does not do this. That means the title *could* be ‘News ‘ and it would be very hard to see.
Good luck.
Thanks again. But it’s not this, it does it, or doesn’t do it no matter what form of ref I put in there, title, tag or id. I thought at first it had to be to do with the location of the header.php or the post.css, but tried them both in both the parent and child folders. Then I tested to see if something in the cascade was busted and the post.css was being overruled by the style.css, but post.css doesn’t appear anywhere in the heirarchy in firebug. Hence my stumpedness.
At present I have resolved this, slightly resentfully at my ignorance, by using a plugin that puts css rules inline with the page. But I hate this as a solution because it just bypasses the problem and I really want to learn to solve it.
It’s sort of a kludge, but you could try using the page’s ID instead of it’s title. IDs are unambiguous and so it might work where the title doesn’t, but they are inherently non-self-documenting, so don’t forget to tell your future-self what ID 14 (or whatever) really means.
Why bother using a completely separate stylesheet. You can simply add the extra CSS to the existing child’s stylesheet and prefix all of the relevant classes and ids with one of the classes generated by the body_class() tag.
Ooh, it’s turning into a chat! Thanks hedronist. Thought I mentioned that I’ve used all the forms of id, including the page id (which is pretty easy with the plugins that display them properly). This was before the problem appeared.
Esmi, thanks. One of the things that has confused me about twentyten is that posts and pages seem not to be distinguished from each other in the classes. I have been resetting the .hentry class but am unsure if this differs in terms of defining blog posts from the .entry class. The nomenclature in twentyten, for such a simple theme, is oddly obscure. It even took me a moment to realise that menus are defined by the term ‘access’.
But I note that the .blog and .archive classes are not used in the style.css, is this what you mean? I’ll give it a go because this is much closer to my normal way of working.
Ok, the body_classes is being called in the header.php body section as expected. But the css still isn’t picking up. I added the following to the styles.css
body .blog #content .hentry,
body .archive #content .hentry,
body .category #content .hentry:{
border-top: 1px solid #E7E8DF;
margin-top: 0;
margin-right: 0;
margin-bottom: 48px;
box-shadow: 0px 5px 7px 0px #9B9C96;
-webkit-box-shadow: 0px 5px 7px 0px #9B9C96;
-moz-box-shadow: 0px 5px 7px 0px #9B9C96;
filter: progid:DXImageTransform.Microsoft.dropShadow(color=#9B9C96, offX=0, offY=5, positive=true);
padding: 10px;
border-bottom: 1px solid #999;
}
body.blog ....
try without the space between body and the .class
Good idea, should have been that. But no change. The html shows that the body classes are working ok but the css still isn’t kicking in.
Got it. For some reason the compound rule was breaking it. When the style is declared for each of the blog, category and archive classes separately it works.
Thanks guys for all your help.
