I have created two virtual blogs from a single install, using two basic categories and a menu link to each category. Now I'd like to have a different header image (banner) for each virtual blog -- i.e., I'd like posts to show a different header image depending on whether they belonging to one basic category or the other.

I can get the effect I want for the category pages using the following CSS:

body.category-1 div#imagecontainer {
background-image: url(/wp-content/ata-images/banner-1.jpg) !important;}

body.category-2 div#imagecontainer {
background-image: url(/wp-content/ata-images/banner-2.jpg) !important;}

However, this doesn't work for single post pages, which revert to the default site banner. Is there a simple way I can get single post pages to inherit the header image assigned to the category to which they belong?

I'd be very grateful for any help! Thanks!

Best, Kit

that should work fine - what is the url pointing to the problem post?
also check the spelling of your category name in the css - computers are notorious for doing what you tell them to do and not what you want them to do.

Thanks for your reply. It works fine for the general category link -- see here, but if I go to a specific post, it defaults to the site banner -- see here. I'd like specific posts to inherit the category banner. I guess this would require a body.single-post div#imagecontainer command, but I can't make it work. Obviously, I'd prefer not to have have to set the banner for each post individually!

edit functions.php and change line 991 (the last line) from

?>

to

// add category nicenames in body and post class
	function category_id_class($classes) {
	    global $post;
	    foreach((get_the_category($post->ID)) as $category)
	        $classes[] = $category->category_nicename;
	        return $classes;
	}
	add_filter('post_class', 'category_id_class');
	add_filter('body_class', 'category_id_class');
?>

Thanks. I've added that (to the functions.php in the ata them directory), but sadly it doesn't seem to be working, despite several page reloads

check the category slug and make sure it has no blanks in it - I see 'consciousness mind' and it should be 'consciousness-mind' and your CSS should reflect that.

also why are you using

if (in_category('mind')) {
body.single-post div#imagecontainer {
background-image:url(/wp-content/ata-images/kf_banner-mind.jpg) !important
}
}

in your CSS? What do you think that will do?

Thanks. I can't see any gaps in the CSS category names. And the problem is there with posts that have only the basic category, like this test post.

I've removed the bit of CSS you noticed -- it was a left-over from an incompetent experiment! But do I need some CSS to get the single post effect (a body.single-post command?), now that the php code has been added?

Thanks for your time. As you can tell, I'm not very competent at this!

I'd like to take a look because my site with multi word category names (ex 'word1 word2'), sets the slug as 'word1-word2' and sometimes yi u have 'word1-word2' but in the header it is 'word1 word2'

so I'd like to take a look at your site. If it is ok, please send me a PM with an admin ID/pw

Ahhhh now I see what is happening

The category is 'mind' not 'category-mind' so your css selector of

 body.category-mind div#imagecontainer {

will never work. You need to code it as

 body.mind div#imagecontainer {

you should take a css tutorial (http://htmldog.com/guides/css/) and learn how to use a code editor so you can look and see what you are doing

That's cracked it! Thank you very much for your help. (And yes, I will take a tutorial!)