WordPress.com is an easy way to start blogging. Get a blog, check out our features, read the latest announcements, choose from great themes, or learn about the team behind it.
Need help? Check out our Support site, then
Hi, my question is how do I hyperlink my header image to the homepage? The theme I'm using is MistyLook. I'm in the process of getting rid of the tabs above my custom header image, but need to be able to link back to my homepage! Any suggestions much appreciated; thanks!
Here is the link:
http://shonshon8.wordpress.com
The blog I need help with is shonshon8.wordpress.com.
First off, go to settings > reading and decrease the number of posts to show on blog pages to 3 maximum. You have way too many images on the main page and it takes for ever to load. I gave up with my wireless connection after 3 minutes.
That is why I can't give you any help on this. I'm not going to waste my limited bandwidth allowance.
It's possible to make the header image clickable (even without the CSS upgrade), but many users don't know that the header may work as a link back home. Why not add a Home link to your list of pages instead? If you'd like that, see here, Note 3:
http://wpbtips.wordpress.com/2009/03/26/page-tabs-as-external-links/
To thesacredpath, yes, I was also trying to find a way to reduce the # of posts on my blog. Thanks for that.
Hi panaghiotisadam, I will try what you suggested; thanks! However, any tips on how to hyperlink the header in MistyLook would also be much appreciated. I'd like to cover both bases!
My no-CSS-upgrade solution is an invisible linking rectangle in the dimensions of the header image, placed exactly in front of it. For the standard version of the theme, that would mean putting this in a text widget:
shonshon8
<div align="center" style="width:100%;top:73px;left:0;position:absolute;z-index:11;">
<a href="YOUR BLOG URL HERE">
<div style="width:760px;height:190px;">
</div></a>
</div>But you've changed the dimensions, so you'll have to change the numbers. The width and height of the inside div should be those of your header image; if you can't calculate the proper top and left numbers for the outside div, try this first (a red rectangle):
<div align="center" style="width:100%;top:73px;left:0;position:absolute;z-index:11;">
<a href="YOUR BLOG URL HERE">
<div style="background-color:#f00;width:760px;height:190px;">
</div></a>
</div>Adjust the numbers till it falls in place, then delete the bg color.
Thesacredpath or hallluke will probably be able to give you the CSS-upgrade variant of this solution or suggest an alternative one.
The code below should hide your existing header image, then add that image to your blog title link so it is clickable and finally shift the RSS feed and other info back above it again. Let me know if you have any problems.
#container {position:relative;}
#container #feedarea {position:absolute; padding:0; right:25px;}
#container #headerimage {display:none;}
#container #header {height:181px; width:950px; margin:50px 25px;}
#container #header h1 {display:block; margin:0;}
#container #header a {display:block; text-indent:-999em; background-image:url("http://shonshon8.files.wordpress.com/2009/12/leopard-print-bkgd-red_950pixels.jpg"); height:181px; width:950px;}This topic has been closed to new replies.
