Tuesday, March 24, 2009

Make the main body wider in blogger

I thought I would just add this little post.

This is just a simple tutorial for making the main body part of a regular blog template (I was using "Minima") wider. It's already well covered
Google results.

It's rather easy. I just did it to try to make the last post look a little better and it took me just a couple minutes.

Go to blogger → Layout → Edit HTML → Expand Widget Templates

Then scroll down (or control/f) to
#header-wrapper {

to find...
width:...px;

Add an amount to increase the width by. I went from 660 to 860, adding exactly 200px.
Now, you need to keep the whole thing together, so next go down to...
#outer-wrapper {

and change the width by the same amount.
Next,
#main-wrapper {

and add the same amount again. Remember, it is the amount you add that must stay the same, not the total amount. The "main-wrapper" is going to be smaller than the "outer-wrapper" because the "outer-wrapper" is also containing the side bar (unless, of course, you did away with the sidebar)

Save and check it. Your blog's main body portion should be wider now.