Yesterday I noticed the Blogspot Configure Header Widget ability to add a Header Image (as a CSS background-image value) to a blog. Never ever noticed that before.
Of course I was curious if this gimmick would work on my templates too.
Yes it does … with a small glitch, though! A 10px padding above and below the image … which looks a bit silly.
So I made a (very very small) change to the templates … 3 x a version 1.1.
You can download these on the Templates Homepages … or here:
blogger_template_tb20090321_v1.1.xml
blogger_template_tb20090402_01_thewhitegrail_v1.1.xml
blogger_template_tb20090402_02_thesecondwhitegrail_v1.1.xml
Or you can keep using the v1.0 version and make the alteration yourself:
change the #header-inner padding from ‘padding:10px;’ to ‘padding:0 10px;’!
(Doesn’t work with the ‘Blogger Template TB20090324 (The Grail)’ and ‘Blogger Template TB20090327 (The 2th Grail)’, alas! This due to the hardcoded rounded corners there … as opposed to the tb20090321′s border-radius properties. Oh Well … .)
Click the image for an example (tb20090321 v1.1) where the Header Image is added using the Widget. Err … the image shows the page rendered in Firefox … not in MIE6/7/8 … hence the rounded – border-radius – corners!
For a ‘fitting’ result: choose the image wide enough … and enable ‘Shrink to fit’!
There is a clear instruction on every Templates Homepage to insert a Header Image manually … the needed marks are in the template code … but why not use the Widget?!?
