Change Blog Width Beyond 1000px

Monday, September 3, 2012

Todays tutorial is the answer to a question I've seen around a lot. How to change the width of your entire blog past the max allowed by the new blogger template designer. It's really simple.

The new blogger template designer has made it really easy to adjust the layout of your blog without having to mess with html, all you have to do is sign into Dashboard, click Design > Template Designer > Adjust Widths.

But the max blog width allowed is 1000px wide. Alter it how you like and click Apply to Blog to save. However, if you wish to change it more than this, Click Back to Blogger > Design > Edit HTML.

When changing the width, keep in mind that people visiting your blog are using different computers and browsers, of all different sizes. You may want to check your blog on a few different browsers and computer screen sizes to make sure it looks ok.

First thing first, click Download Full Template. This is for backup, incase something goes wrong. It is always a good idea to backup your design before altering anything.

More than 1000px

Search for <b:template-skin>
If you press CTRL & F (Or CMD & F on MAC) on your keyboard you can search for this term.

You'l see something similar to the following

<b:variable default='930px' name='content.width' type='length' value='1000px'/>
<b:variable default='0' name='main.column.left.width' type='length' value='0px'/>
<b:variable default='360px' name='main.column.right.width' type='length' value='260px'/>

To change the overall width, change 1000px and to alter your sidebar change whats in green. There you have it, a wider blog layout.