Saturday, February 27, 2010

Monday, February 22, 2010

Want larger photos in your blogspot posts? Here is how you do it.

Want larger photos in your blogspot posts? Here is how you do it.

Unfortunately, Blogspot limits your photos to a maximum of 400 pixels wide and there aren’t any templates that will let you automatically go larger than this. So to get bigger photos in your posts, you will have to make your blog wider. Then every time you upload a photo, you will need to do a very basic edit on the HTML in the new post dialog box.

First we will make the blog template larger, and then we will go thru the steps of making the photos larger.

CAUTION: If you are not comfortable editing HTML, I suggest you create a new blog to practice on before you modify your live blog.

Larger Blog Template:

  • From your Blogger dashboard, click on Settings.
  • Click on the Layout tab.
  • Click on Edit HTML
  • Click on Download Full Template to save your existing template just in case you make a mistake and want to go back to your original template.
  • Find “header-wrapper” and change the header width to your new blog width. I set this blog to 1000 pixels wide. You don’t really have to change this, but if you do, 900-1000 px is a good place to start.

#header-wrapper {
width:1000px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

  • Find the “Outer-Wrapper” section. Now we are going to set up the width of the blog (outer-wrapper), main posting window (main-wrapper) and the sidebar (sidebar-wrapper). This blog is 1000 pixels wide so I set the outer-wrapper to 1000px, main-wrapper (photo section) to 830px and my sidebar to 170px.


/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper {
width: 1000px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
#main-wrapper {
width: 830px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 170px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Of course, these dimensions can be anything you want.

  • Click the Preview button.
  • If your blog doesn’t look the way you want it, just go back and adjust the wrapper sizes above.
  • If your blog looks OK, click on Save Template.
  • If you really messed up your blog and want to go back to the original layout, don’t panic there are a lot of ways listed on the Edit Template page to get you back where you started from, including reloading your original template you saved when you started.

Larger Photos:

Now your blog template is set up to handle larger photos. Unfortunately, the photo upload will not let you go any larger than 400 pixels wide automatically. It is pretty easy to manually override this when you upload a photo. But you will have to do the steps below every time you upload a new photo.


  • I suggest that you resize your photos before you upload them. There are many ways to do this. Google “image resizer” and you will find a lot of options. I resize my images to 800 pixels.
  • Upload your image and then click on Edit HTML
  • If you uploaded your image using the web based uploader look for the following text and delete it:

width: 400px; height: 266px;

Note: Your image height may be different than 266px but you will need to delete it anyway. Also, if you uploaded your image using Picasa, you will not find the width and height in the html. Just go to the next step.

  • Now find s/400 and change it to s/800.
  • Click Preview and then Publish your post.


That’s it! You now should have a blog that you can post photos 800 pixels wide in.

Sunday, February 21, 2010

Photo A Day 1/21

We haven't seen the sun in a long time. But yesterday enjoyed a beautiful sunset.

Friday, February 19, 2010

Tuesday, February 16, 2010

Saturday, February 13, 2010

Monday, February 8, 2010

Photo A Day 2/8

NU Cheerleaders Flying High!
Posted by Picasa

Friday, February 5, 2010

Photo A Day 2/5

You can never have enough cream cheeze can you dear?
Posted by Picasa