FREE GPRS,hacking,gameschets.etc

I was in the process of changing the template for my personal blog when I got this idea. I'm not sure whether anyone has already released this hack. Anyway, it is a very useful one.

We have seen several webpages where the sidebar blocks are alternating in style. (color, generally)
In websites, it is easy to do this by manually giving different classnames for alternate sidebar blocks. But this wouldn't be possible in Blogger, particularly because of the Drag-and-drop mechanism in Page Layout, which makes it difficult, because the owner has to change the class every time he repositions the widget. Also, it is tedious to add our custom code every time we add a new widget. After all, we are supposed to render ourselves indolent by making a one-time change to ease our work! ;)

So, is there a way to automate the alternating sidebar block styles? Sure there is!
Even I didn't expect it to be so simple a code when I started coding this.
If you want to see this hack in action, visit my test blog.

IMPLEMENTATION
1. Look for ]]></b:skin> tag in your template and copy this code just above that.

.even {
background-color: #EEEEEE;
}
.odd {
background-color: #AAAAAA;
}

This is where you make your customisations. Use whatever CSS you want to customise these two classes. I have just given background colors here.

2. Copy the following code just above the </head> tag.
<script src='http://bloggerhacked.googlepages.com/prototype.js' type='text/javascript'></script>
<script src='http://bloggerhacked.googlepages.com/evenodd.js' type='text/javascript'></script>

3. Save the template and you're done. That's neat and easy. :)

Note for advanced users: You might already be having prototype framework and addLoadEvent routine attached to your blog. In that case, feel free to take my Javascript file, modify it and host it in your preferred location.