Friday, June 26, 2009

How To Change Blogger Blog Width

To adjust the width size of your blog according to your preference, you can do so at the HTML section:

Dashboard > Layout > Edit HTML

Then you can change the width size to the size that you prefer.


#header-wrapper {
width: 750px;
}

#outer-wrapper {
width: 750px;
}

#main-wrapper {
width: 490px;
}

#sidebar-wrapper {
width: 230px;
}


Header-wrapper and outer-wrapper determines the maximum width of your blog.

Main-wrapper determines the width of your blog content and sidebar-wrapper determines the width of your sidebar.

Make sure that the total pixel (px) allocation for the main-wrapper and sidebar-wrapper is not more than the outer-wrapper's size.

8 comments:

Mike said...

Thanks for the post. From what I understand here, you can't have a header wrapper at say 67%, then slide your sidebar wrapper up into the vacant 33% - is that correct? I've got some space there and I'd like to pull my sidebar up so that most of it is visible without having to scroll down. Thanks,
Mike
here's the blog, if that helps clarify things.
http://thegrammers.blogspot.com/

Simple Blogger Tips said...

@Mike:
I understand what you want. It can be done, but quite a complicated process. The reason why the sidebar is not aligned at the top is because the top space is allocated to the banner. The banner is supposed to take up 100% of the width.

One simple hassle-free solution is to pick a new template, which has the sidebar totally at the side.

Alisha said...

Thanks for this post! It helped me do exactly what I wanted. :)

Etobicoke Electrician said...

In my "Add and Arrange Page Elements" I can add a 100% wide gadget only. 50% wide gadgets are not shown as an option. But that's exactly what I want to add - to 50% wide gadgets, one on the left and another on the right. How?

Simple Blogger Tips said...

@etobicoke:
Did you mean the "sidebar"? If you want 2 sidebars on the left and right, you'll need to modify the HTML code, or find a new template that has what you want.

New Life in Spain said...

Hi! Just found this blog as I was searching for how to change blog width. However I can't find the html-codes you suggest. Could it be that the design has changed since you posted this, and would you know what to look for in the new design? Sorry to bother you with this, eel free to ignore me :)

Simple Blogger Tips said...

@Norwegian Senorita:
Now with the new Template Designer, you can customize the template width easily. Click to read about the Template Designer. That should work fine if you're using the default templates.

New Life in Spain said...

Thanks for your answer. I tried this, but my header didn't increase with the width, so then I need to make another header. I guess that will be the solution at some point. Thanks so much anyway :)

Related Posts Plugin for WordPress, Blogger...
Follow Me on Twitter