27 September 2011

How to Adjust the Width of Your Blog

Even before I started this blog I wanted to change its width. It's true! I wanted to have a wide central column so that I could illustrate my insightful articles with beautiful big photos.

At last I learned how to do it and I am eager to share the knowledge with you. Here is a quick magical way to make your blog even wider than what Blogger allows in the Template Designer.

Before you start following this tutorial, make sure you have saved your template in case of failure.

1. Go to Design and then click on Edit HTML.

2. If you are using Mozilla Firefox press Ctr+F and paste this code:   <b:template-skin>. You will see it highlighted in green in the HTML template of your blog.

3. Now look at the next row. You will see this:
      <b:variable default='930px' name='content.width' type='length' value='1050px'/>

And you know what? The last value, namely 1050 is your magic number. This is the total width of your blog template. It could be different for different templates and this is ok because you can change it to any number you like (as long as it fits a regular screen, of course).

If I change it to 1300 and click on the Template Designer and then on Adjust Widths I can see perfectly well that I've done the job and the value has changed:

See? I told you it was magical!

Happy widening!