Friday, July 23, 2010

How to post bigger pictures on your blog

In order to post pictures on your blog in the extra-large size like mine, you simply need to make your blog wider.  Here's how you do it with Blogger:

1) Decide how much wider you want your blog to be.  Right now my blog is 1050 pixels wide; I think the default was somewhere around 700.

2) Increase the width of the area that contains your blog posts:
  • Go to Design, then click "Edit HTML"
  • Do a Find using your browser (press Ctrl-F or Command-F) to locate the CSS section called #main-wrapper
  • Increase its width property by whatever value you desire. Mine is set at 680 which perfectly accommodates the "extra-large" photo size.
#main-wrapper {
width: 680px;
float: $startSide;
...
}

3) Increase the width of the other wrappers to accommodate the expanded main wrapper:
  • Locate the CSS sections called #outer-wrapper#header-wrapper#header .description and #footer
  • Increase their width properties by the same number of pixels you added to main-wrapper.
#outer-wrapper {
width: 1050px;
margin: 0 auto;
...
}

#header-wrapper {
width: 1050px;
margin: 0 auto 10px;
...
}

#header .description {
margin:0 5px 5px;
padding:0 20px 15px;
max-width:1050px;
...
}

#footer {
width: 1050px;
clear: both;
margin: 0 auto;
...
}

1 comment:

  1. Thanks so much, Angie! Now that I've wasted hours of my life my blog is looking much better! :) Thanks again!

    ReplyDelete

Everyone likes comments. Leave some love!

Related Posts Plugin for WordPress, Blogger...