WordPress.com Forums » Topic: Can I change header height on home page only?

designsimply on "Can I change header height on home page only?"

designsimply — Sat, 27 Oct 2012 02:15:14 +0000

Cheers :)

northbrookdairy on "Can I change header height on home page only?"

northbrookdairy — Sat, 27 Oct 2012 01:48:00 +0000

That worked beautifully! Thank you very much!!

designsimply on "Can I change header height on home page only?"

designsimply — Fri, 26 Oct 2012 17:17:16 +0000

Here is a CSS example that will replace the header image just on the home page in the Coraline theme:

.home #branding img {
	display: none;
}

.home #branding > a {
	display: block;
	height: 479px;
	margin-top: 30px;
	background: url(http://northbrookdairy.files.wordpress.com/2012/10/nbf-header-990x479.jpg) no-repeat;
}

northbrookdairy on "Can I change header height on home page only?"

northbrookdairy — Mon, 22 Oct 2012 17:06:19 +0000

Here's the link to my original, tall header. If I could feature this just on the home page, that would be swell.

http://northbrookdairy.files.wordpress.com/2012/10/nbf-header-990x479.jpg

designsimply on "Can I change header height on home page only?"

designsimply — Thu, 27 Sep 2012 20:45:13 +0000

I checked http://northbrookdairy.com/products/ and it looks like you've removed the large header image from the home page for now. If you'd like to add that back and post another reply here, I'd be happy to help you take a closer look.

The solution I would use for this problem would be to replace the header image JUST on the home page with the larger image. If you'd like to try that option, please provide a link to the header image from your media library in a reply here.

northbrookdairy on "Can I change header height on home page only?"

northbrookdairy — Tue, 18 Sep 2012 19:57:16 +0000

I changed the header height in CSS to accommodate my nice tall header (990x499) which looks great on my home page. However, I'd like to use a normal-height header (990x180 in Coraline) on all other pages and posts. When I set a normal-height header as the Featured Image on a secondary page, there's a big gap between the bottom of the header and the beginning of the body text on the page. Clearly, I need to enter some kind of conditional statement that changes the header height *only* on the home page. Is this do-able in CSS?