Sunday, April 11, 2010

Blogger UnWrapped: Posting Large Images, UPDATED!

Blogger makes it easier than ever to post large images now. I would suggest cropping your images web-sized before uploading them so your original large images won't get stolen.  I usually don't load images larger than 1000px wide.

Make sure you are using the new post editor. If not, it is easy to set up.
 (Warning:  The new post editor does not have spell check for some crazy reason...  That is bad news for people like me!)  Go to Settings, Basic. 

Go down to Global Settings and click on Updated editor and Save Settings.  You can go back to the old editor whenever you want. 

Go to Posting, New Post and make sure you are on the Compose tab.  Then click on the add image button on the top menubar and upload your already web-cropped image.  I have quite a few free web actions that will automatically crop and sharpen your images for the web and add rounded corners or a drop-shadow (if you want).  Just scroll down to web actions to find the list.

Now simply click on your image and click on X-Large. You can also click on left, right or center. You are now finished!  Well, if you don't want to load really large images that is. 

Blogger still shrinks your images even when you click on X-Large.  For a normal Blogger 2-column blog that won't be a problem and X-Large will be big enough.  But what if you have a large one-column photoblog and want to post an image that is 975px wide?  There is a way but you have to read on.  I like using this method because you can also tweak the html code so you can make your image any size you want and are not limited to Blogger's idea of small, medium, large and x-large. 
Start from the beginning and upload your image.  After uploading it click on the Edit HTML tab.
Find the two codes (highlighted in yellow in my images above).  Make them both s1600 and publish your post.  This will make your image the original uploaded size.  So if you upload a 900px image it will post as 900px.  If you crop your images for the web before uploading this is a wonderful quick way to make them huge.

If you want even more control to be able to post an image any size (for example, you upload a large image and want to crop it to a certain size in your post) and be able to go back and change it at any time, there is another method.  

Start over in the Compose mode and upload your image.  After uploading your image click on the image to select it (in the Compose mode) and click on X-Large (as seen 3 images above).  You have to click on a size or this method won't work!  Then click on the Edit HTML tab.

Find the two codes (highlighted in yellow in my image above). Make them both s1600.  Then find the code for "width" and put in what you want as the final px width of your image between the " "and delete the height code completely.    You can adjust your image to any size now and you are not limited by Blogger's predefined sizes.  Please see the image below for an example. 

Now you can go back to the compose tab and finish your post.  Once you publish it, your images will be the size you selected, not Blogger's preset size of small, medium, large!  Plus you can go back at any time and adjust the final width size.  Wasn't that easy.  :-) 

Remember, you can't make an image bigger unless you don't mind it looking low resolution.  Don't upload a 500px wide image and make it 1000px wide.  It will look horrible.

This sure beats my old tutorial which was a bit of a PITA.  However, if you want to stick with the old post editor (that has spell check) that method works perfectly fine.  :-)

I am going to be posting the second part of my texture tutorial this week, so make sure you stop by!


  1. Thanks for this updated tutorial, but isn't just selecting the "X-Large" photo option just as good? Also - with this tut, what size should I be cropping my pics to?

  2. ooh, off to try it...i'll just have to be more diligent in my spelling. thanks for all you do. i've had lots of compliments from friends and family on how cute my blog is.

    thank you rita, you rock!!!!

  3. I too am unsure why I would bother to do this when I can just select the X-Large setting when and if I want an image to be big :-)

    I say "if" for many reasons, but one of them was that I viewed my blog on someone's laptop recently and was horrified at HOW BLOODY BIG some of my images were. Way too overwhelming. I had completely forgotten that everyone has different monitor and screen settings and what looks good to me can look awful to someone else :-)

    I now make efforts to restrain myself LOL :-)


  4. Not sure if it was due to the size I cropped my original too but with this method it ended up being the same size as the x-large option... still better than before.

  5. or try Windows Live is soooo much easier!

  6. You are a genius. I knew there had to be a way to keep blogger from shrinking the photos. I am thrilled to know how to set the width to the maximum size of my blog box (490 px in my case). I prefer the old editor but switch back and forth between the old and the new. I also upload images using Picasa. You covered all the bases for me. Thank you so much. Rosemary

  7. If you have a wide one column photoblog just clicking X-large won't make the image it as large as you might want it! However, it works great in smaller columns.

    So if you want to post a 950px wide image in a 1000px wide column you will have to do the additional steps. Unless I am missing something!


  8. The new editor also doesn't let you upload video. Can't figure that one out either. I had to revert to old one to do video.

  9. Love all your Blogger tutorials!
    Thank you so much!


  10. Just a quick note to let you know that a link to this post will be placed on CraftCrave today [12 Apr 02:00pm GMT]. Thanks, Maria

  11. Oh, my that is certainly easier!! No more needing to upload to photobucket first!!! Thank you for pointing this out.

  12. Thank you Rita!!! you are great!!! peace from the south side of the world!

    Mariana (ex Luar Fotografias)

  13. thanks for the info.... I didnt even know Blogger had released those updates!

  14. Thanks for the tip! I would love to see more of your web storyboards...hint, hint!!!

  15. I second using Windows Live Writer! I can upload images and select "Original" as my size, whatever I cropped them to is what they'll be. Love it!

  16. For some reason I set up my newer blog using the old editor. Are you sure I can change to the new one without wrecking anything. I would love to!

  17. Thanks so much for these tips - they're great!

    One question - is there any way to make the photos look as clear and crisp on Blogger as they do when I'm viewing them in other programs on my computer? I'm sure I'm missing something, but it seems like they are fuzzy when I upload them (no matter what size I change them to in the Compose mode).


  18. coolness! I'm trying this right now. I couldn't understand the other I'm jazzed!

  19. I was so sad looking at my teensy photos on my blog.

    Now I am happy!


    Like my little girl tells me "I love you tooooo much!"

  20. www.fanography.blogspot.comOctober 18, 2010 at 1:09 AM

    Thank you, thank you, thank you... I would go crazy without your help :)

  21. Hello all, this is my first post here, just getting familiar with the place!

  22. I found this post while searching for a way to fix my pictures that seem blurry after I upload them to Blogger. They look great in Picasa. Did you have some great advice for the Weilers? Sounds like they were having the same problem I am. Thanks! :)

  23. Thank you so much for this fantastic tutorial! You have made my life so much easier!


♥ CoffeeShop Sponsors ♥