Beside this minimalistic blog, I have another blog (that is actually more of a web-site) for which I decided to go with the Sandbox Theme, cause I wanted to customize my page. Yes, you have to buy the Custom CSS upgrade (10 bucks.. a year?!).
One of the most difficult (less documented) tasks has been to change the blog title with a custom image and keep it clickable, so that users can always come back to the main page easily.
The only tutorial I found that is still online is this, as well as some posts in which sunburntkamel (the author) talks about it.
The trick is to expand the a
element to the size of your image, and display the title itself off-screen.
My title is center-aligned, so this is the code:
#blog-title { margin: 0 auto; position: relative; width: 361px; } #blog-title a { background: transparent url('http://myblog.files.wordpress.com/2011/06/my_logo.png') top center no-repeat; display: block; height: 250px; text-indent: -9999px; }
So, as you can see, the text is 9999 pixels left of the display, and the image is as large as the clickable portion of the page! yippie!