Hi – I’m also using Almost Spring and am struggling with the same question. I’m working through the information on http://codex.ww.wp.xz.cn/Designing_Headers to try to resolve this. I’ll let you know if I get it right!
Hi again – I think I’ve finally found a way of doing this, based on the instructions on the WordPress page I linked to in previous post. Hope this works for you too!
In style.css, I replaced the header section with:
#header {
width: 740px;
height: 130px;
background: url(LOCATION OF YOUR HEADER IMAGE) no-repeat;
border-bottom: 7px solid #003300;
}
/* Header styles */
#header h1 {display:none;
margin: 0;
padding: 35px 0 0 40px;
font-size: 2em;
line-height: 40px;
}
#header h1 a {
text-decoration: none;
}
#header p {
margin: 0;
padding: 5px 0 0 40px;
}
You should check your existing border-bottom colour value as the one above is different to the default Almost Spring colour.
The width and height values are the dimensions of your header image, so these should be the same as the jpeg pixel dimensions.
The background:url is the location of your header image.
The display:none instruction tells it not to display the text showing the title of your blog.
I still need to play around with my header image jpeg to make it look good, but I’m pleased I’ve finally got this to work!
there’s another way to do this, if you want the image to be a clickable link back to the homepage…
change:
<div id="header">whatever's in here</div>
to:
<div id="header" onclick="location.href='http://YOURDOMAIN.com/';" style="cursor: pointer;"><img src="path/to/your/image.jpg"></div>
and go to the options page in your admin and delete the title and description lines.
Thread Starter
jkent
(@jkent)
Hi Ladies, thank you both so much for your help. I now have image on site as hoped.
All I need to do now is figure out how to change text colour – onwards & upwards!
Thanks again.
Thanks. I just switched from Typepad (the land of one-click header images). The only thing I did differently was change the border-bottom color to #ffffff so the (white) header blends seamlessly.
