WordPress.com Forums » Topic: Category page headers in Twenty Eleven

simianreflux on "Category page headers in Twenty Eleven"

simianreflux — Sun, 02 Sep 2012 21:39:57 +0000

designsimply, the code worked a treat.

Thanks a lot~~

designsimply on "Category page headers in Twenty Eleven"

designsimply — Wed, 29 Aug 2012 15:22:09 +0000

This should do the trick:

.category-danger-zone #branding a img {
	display: none;
}
.category-danger-zone #branding > a {
	background: url(YOUR_IMAGE_URL);
	display: block;
	width: 1000px;
	height: 288px;
	border: 1px solid red;
}

Replace YOUR_IMAGE_URL with the URL of an image you have uploaded to your media library.

To change out the header for a category page other than the "Danger Zone" category, change the ".category-danger-zone" parts of the selectors to ".category-YOUR-CATEGORY-NAME".

simianreflux on "Category page headers in Twenty Eleven"

simianreflux — Mon, 13 Aug 2012 21:54:19 +0000

Hi thesacredpath,

apologies for being forward and asking again, but any update on the CSS code for the custom header images?

Thanks~

thesacredpath on "Category page headers in Twenty Eleven"

thesacredpath — Tue, 07 Aug 2012 16:51:14 +0000

You are welcome.

simianreflux on "Category page headers in Twenty Eleven"

simianreflux — Tue, 07 Aug 2012 14:35:52 +0000

Thanks so much for your help thesacredpath.

thesacredpath on "Category page headers in Twenty Eleven"

thesacredpath — Mon, 06 Aug 2012 20:58:00 +0000

That is a little dependent on the theme used. Some older themes do not have the required selectors to be able to do that. With 2011, the theme you are using, yes it is, but a couple things you should know.

First off, since the header image will be inserted into the CSS rather than through the theme script files, it will not resize with the browser window as the standard headers do on 2011.

Secondly, if you are looking to have a different image for each category you have to create targeted CSS for each and every category. If you add a category later, you have to create more CSS for that category.

This requires a bit of manipulation and I'm on my way out the door so it will be a while before I can give you the code.

simianreflux on "Category page headers in Twenty Eleven"

simianreflux — Mon, 06 Aug 2012 10:41:57 +0000

Hi,

I recently posted a question in another forum (support) asking about custom header images for different category pages.

(http://en.forums.wordpress.com/topic/custom-headers-for-different-categories?replies=8#post-966795)

The outcome from this post was that as category pages are created on the fly it is not possible to assign custom header images.

Today I came across this post (http://en.forums.wordpress.com/topic/how-to-remove-the-header-of-a-category-page-and-to-edit-soundcheck-hero-slider?replies=6) which suggests that it's at least possible to play with the header images for category pages.

So, at the risk of sounding like a skipping record and wasting everyone's time (apologies!), is there any way to display a custom header image for different category pages via CSS?

Thanks so much for your help~