Uploading Pictures To Blogs. ~ The Blog Doctor.

Uploading Pictures To Blogs.

New Visitor? Like what you read? Then please subscribe to my Blog Feed or sign up for Free Email Updates. Thanks for Visiting!

Many new users are confused about how to upload pictures to Blogger. There are three places in your blog where you may need pictures. One is in the template where you put pictures which can be seen from anywhere in the blog. You can put them in the header, in the background or in the blog columns. You can also make them into clickable links. The second place is in your profile. The third place to put pictures is in your post.................

At the outset let me reiterate that you can only upload pictures to blogger and for all other files see Upload files to Blogger.

To upload pictures to your post first login to Dashboard and click on +New Post. The Post Editor opens and click on the blue square icon in the top frame (see arrow in picture below :)

Click on picture (Image 1) to enlarge it.

You will get a Dialog popup window in which click the Browse button and locate your picture file on your disk and click Open. Then Choose layout and Image size options. You can only upload jpg, gif, bmp and png images, 8 MB maximum size. Then click the Upload button at the bottom. The image uploads depending on the size of the file and the speed of your connection. The default position for image is the top of the post after clicking the DONE button. Click on Edit Html tab of Post Editor to see image code at the top :

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_J2kVk3AKsXA/Ri2KOKBwJGI/AAAAAAAAAYw/fM_9vI4F2hw/s1600-h/PostPictures.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;" src="http://4.bp.blogspot.com/_J2kVk3AKsXA/Ri2KOKBwJGI/AAAAAAAAAYw/fM_9vI4F2hw/s400/PostPictures.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5056849932421440610" /></a>

The above code is for the Image 1 in this post. To reposition the image within the post select this whole code and cut and paste it to wherever you want in the post. You can also do this by clicking on Compose tab of Post Editor and using drag and drop.

Careful examination of the code shows two image links :


This is the bigger (actual) size image produced when clicked on the real picture above given by this code :


If you wish to put this resized by blogger image in any other site use the second link above in code like this :

<img src="http://4.bp.blogspot.com/_J2kVk3AKsXA/Ri2KOKBwJGI/AAAAAAAAAYw/fM_9vI4F2hw/s400/PostPictures.jpg"/>

This will produce the resized picture below again ( Image2 ):

NOTICE again that the above picture cannot be clicked to produce a bigger image like Image 1 above.

If you want the same sized image to appear use the first link in the same code like this :

<img src="http://4.bp.blogspot.com/_J2kVk3AKsXA/Ri2KOKBwJGI/AAAAAAAAAYw/fM_9vI4F2hw/s1600-h/PostPictures.jpg"/>

NOTICE that the first link is the link to the unaltered image.

At the bottom of the Upload dialog window is listed your current Storage Usage. From this you can know whether you have no more space left to upload images. If you do not have any more space, upload image file to a free host and paste this code in Edit Html tab of your post :

<img src="LINK OF YOUR IMAGE"/>

Replace the caps with the link to your picture in the free host.
Add width and height parameters to the code to speedup the loading of the page.


To put a picture in your profile use the second method by uploading to a freehost as it is easy to make a mistake while extracting image links from uploaded images in Blogger posts. Then login to Dashboard and click Edit Profile link in sidebar. Scroll down and paste your image link in Photo URL box and save.


Mike Fladlien said...

your blog helps me mucho...thanks, flad at mikeroeconomics.blogspot.com

Helen said...

I also just wanted to say thank you for all the great information provided on your blog. Everything is written in such a simple language that it is easy to understand for such a beginner [with blogging] as myself. AND I'm a blonde! LOL

Thank you sincerely,

Heavyarms said...

Is there a way to post the image without blogger resizing it? For example, if I want to post an image that is 600px wide, is there a way to do that?

vin said...

Upload your 600pximagetoa freehost which does not resize it and copy down the link. Then paste the img src code line with the image link in Edit Html tab of your post and publish

梁妈妈 said...

Hi Vin,

May i know how to display the picture side by side? When i upload more than 1 picture, it will automatically display in column. I have tried to manually adjust it but fail.

Thanks for your help!


vin said...

Take a look at :
Thumbnail Albums in Blogger

Daniel said...

Hey Vin,

Your page is great. It helps me a lot, spceally when I was trying to put a picture in the header.

but I have a question: do you have any idea how we upload pictures in the posts and then when you click in the picture, the picture will open in a type of pop-up window, where you could navigate trought the photos easily, going foward and backwards in the pictures.
If you not understanding what I mean, just take a look in the blog



vin said...

Take a look at :


M said...

For my profile picture, the image link disappears from my Photo URL field after clicking Save. What could be causing that? I know the link works, because I've opened it from a new browser.

vin said...


Try refreshing the cache. See :

Refresh Cache

Use Firefox browser.

M said...

Hi again,
I've refreshed the cache and tried it with Firefox, but the image link still disappears when I click Save. Is there anything else I can do, or should I report a bug? I've imported images into my blog without problem, it's the profile image that isn't working. Thanks.

vin said...

Try uploading to Googlepages. Use my email address in left column for more detailed help.

M said...

That's fantastic! It works with Google pages. Thanks for your help and patience!

BlogHer said...

Your blog is terrific. I'm so glad I found it.

Can you tell me how I can get my animations moving again. Some of them work and all of a sudden some of them stopped a few days ago. I'm using only 1% of my space and have 15 posts on my main page. Thank you.

vin said...

Reduce posts on main page to speed up blog loading. See :


Animations sometimes stop and start of their own accord.


hey pls insist me to upgrade my blog.. i don no anything about it... but i hav to learn to creat it... so help me.. my blog page is

vin said...

Ajith Simha,

If you can be more specific about what you want to do we may be able to help you. Use my email address in the middle column to send me email.

clueless but hopeful mama said...

I'm new to blogging and want to put simple captions under my photos within the text of each post. Is there a simple way to do this for the novice? Thanks!

vin said...

clueless but hopeful mama,

Use a table with two rows and one column with picture in top cell and caption in bottom cell. See :


mushroomgarden said...

Hello Vin,

I don't want my images to be enlarged and I don't want the link to the enlargement image. How do i do that?

Thanks :)

vin said...


Upload your images to a free host after adjusting their size on your PC. Copy down the link and paste it in Edit Html tab of Post Editor like this :

<img src="LINK OF IMAGE"/>

Replace the CAPS with your image link and publish the post. The image will not be enlarged and will not link to another enlarged image.

mushroomgarden said...

Hey Vin,

Thanks for your quick reply. But I do see some of my friends' blogger images "unclickable". And I am pretty sure she didn't host the image somewhere else. Does blogger allow that function? Or can I tweed the html code or something?

vin said...


As explained in the post above it is easy to make a mistake while extracting the image links from the whole code which blogger writes after the upload.

There are two image links in the code : One of the original image and the link of the resized image.

See the post above for how to extract the link after uploading and then paste it in the same code given in my previous comment.

mushroomgarden said...

thanks vin!

Kate said...

When creating new posts, blogger no longer automatically creates links for my pictures (I am using the upload picture button). As a result, readers can no longer click on the photo to enlarge it.
Any idea what is going on? I have searched through my settings but can't find this "feature" anywhere.

vin said...


Have a look at the picture code, in Edit Html tab, after uploading it. If it is similar to the one described above then you need not worry.

Also try clearing the cache AND/OR use Firefox browser :


Kate said...

Hi Vin,
I forgot to mention in my original comment that yes, the html for the picture link is in fact missing. I will try your two suggestions--my team member publishes on the same blog using Firefox and does not have this issue. Thanks so much!

Edgar Agudelo said...

Very educational your post. Thank you.
I did not see you comment on uploading to the template. After I upload one picture, when I try again get a message that says something like "correct errors on the form", but I do not see anything to correct. That prevents me from uploading for that entire day, but if I try again some days later then I am OK ONE TIME again.

Your suggestions will be appreciated,


April said...

Hey- I want to post a collage- or just arrange multiple photos my own way- but I don't have the link on my photo upload page to customize my own layout. Do you know why? How do I go about in doing this- Thanks

vin said...


You have to combine multiple photos into a single photo on your PC and then only you can upload it. At the moment Blogger does not offer collage making services.

vin said...

Edgar Agudelo,

Try clearing the cache. See :


Use Firefox browser. Try another browser like Opera.

The Misadventures of Andy & Bumper said...

Love your blog it has helped me post a photo onto my blog:) I am having a hard time posting another photo on the same blog page.
Can you help?
Thank you,

vin said...


Where do you get the error message and what is it?

The Misadventures of Andy & Bumper said...

I didn't get an error message what happens is the upload page with the exclamation point saying the upload takes places stays up forever. When I uploaded the first picture with the help of your awesome blog it was very quick. Can you post more than one picture on the page?
Thanks Again,

vin said...


Try clearing the cache :

Refresh Cache

Use Firefox browser. Also see :

Tips On Pictures in Blogger

Mr. UnloadingZone said...

Thanks, Vin! Once again, you take the time to point out the obvious to us too blind to see it staring us in the face. First time I put pictures in a post and they look great!

Ričardas said...

Hi Vin,
I have uploaded an image and it looks fine in preview mode but after publishing it turns into black and white. It's like that in any place on the blog - posts, heading, side banners. I suspect that it has something to do with template because I am using customized one but I can't figure out where is a problem. Any ideas? Thanks for any help.

vin said...


What is your blog address and where is the image?

Sumbongera said...

Hi, how do I resize my images without pixelizing it? Whenever I resize they end up pixelized. Also, how do I take the borders off my pics? I have this thin border around all my pics. Thanks!

vin said...


Resize images on your PC BEFORE uploading them using an image editor. To take borders off your pics see :

Tips on Pictures in Blogger

Demeur said...

All I can say is where were you when I started my blog. I pulled my hair out trying to get any links to work when I started my blog. I'll definitely recommend you to anyone having problems and as Arnold would say "I'll be back" Thanks vin

haasertime said...

sometimes when i add an image, it screws with the text in the post. the spacing is all wrong, rendering it nearly unreadable. help!

Vin said...


Have a look at :

Tips On Posting Pictures in Blogger

Bliss said...

Hi Vin, it's great I have found you!!!!

I have a photoblog in which I would like to show bigger images as I found in this blog: http://kareymichelle.blogspot.com/
Is it possible?
Thanks a lot for your help, you are doing an awesome work :-)

Vin said...


Upload your pictures to Photobucket.com and copy their link and paste it in code like this :

<img src="LINK_OF_PICTURE"/>

Then paste the code in Edit Html tab of Post editor. Publish Post.

Bliss said...

Wowww!!! It works!!! Many thanks, Vin, your help has been unrewardable. Now I must change the whole design of the blog in order to fit in the big picture, but that's the funny part :-)

Thanks a lot!!!

py2ny said...

I am on the same way of other readers and need to thank you about nice job here... Would like to close with a question. I am doing my initial "transmissions" with Word 2007 and works fine with text. I made a test with one picture from my own HardDrive and send the post to Blogger. Only text appears... Can I upload images directly from my HD, and together the respective text, using MS Word?

Vin said...


Word can introduce unwanted formatting. Try this method :

Show Word Docs. in your posts.

global peasant said...

How do I enlarge my profile photo in 'blogger'? (just double 2-3 times would be great)

Vin said...

Global Peasant,

Create your own profile page

Diane Thompson said...

Hi Vin,

Not sure what you mean...I am trying to enlarge the profile photo on the homepage of my blog. Is there a setting somewhere within blogger that I could adjust the size?



Vin said...


You can only do this by adding a profile widget of your own :

Create Second Profile Widget.

moongod said...

I am totally new to blogging. I read how to put a picture (photo) on my blog site, but I can't remember everything you listed, and I cannot print your information. Is there any way one can print out your great information? I tried to print it, and all I got printed was brown pages (totally all brown!)


Vin said...


LOL! No need to print out the whole page! Just copy and paste what you need to a Notepad file and print that.

Anonymous said...

All this info is great. I'm on an initial wade-through---just learning.

thanks so much.

Sandy Kirkpatrick said...

Good explanations, but it fails to tell us how to post photos with wrap-around text. THAT would be incredibly helpful info!

Vin said...

Sandy Kirkpatrick,

Have a look at Tips on Pictures in Blogger.

new-oma. said...

for me the second code does not work, its not any bigger..

i really dont know why


Vin said...


Have a look at how to Upload Pictures Without Changing their Size in Blogger.

lydia said...

Hi there, I've been doing my blog for about a year or so. I've had no trouble uploading photo's till now. After uploading I click done but all that shows up in my post is a whole lot of code stuff I don't understand! Why and how do I fix it so the actual photo shows up?

Ta, Lyds

lydia said...

Hi again, I forgot to mention that I have already resized the photo's on my photo programme on my pc.

Ta Lyds

Vin said...


Click the Compose tab in upper right corner of Post Editor to see the picture.

nana naoko-san said...

hye, actually i've been wondering how to put this picture? http://bp0.blogger.com/_5QIU8D7GfDs/R2n80B2preI/AAAAAAAAAHo/gUnQ8pZXQiE/s1600-h/spinning-lady.gif

thanx...its a moving sort of picture...so i dont know how :(

Vin said...

nana naoko-san,

Have a look at Tips on Pictures in Blogger.

π said...
This comment has been removed by the author.
Vin said...


If you mean the first image in the right sidebar then it is too big. There is no space for additional margin. Either upload a smaller sized image OR increase sidebar width.

Anonymous said...

i had a recent problem with uploading d pics on my site.

i uploaded some pics yesterday but it didnt come out anything on the public area and
i tried two or three times but the same problem i've got it. other entries were totally disappeared on my site..
Could u plz tell me how can i get all my old entries n new one.

thx vin ..im waiting for ur reply.


Anonymous said...

here is my blog link


Vin said...


Try using Windows Live Writer.

traci griffin photography said...

I Vin,

I want my photos to be larger when I upload by default. instead of 400px being the max width or height, I would like a 600px. Can I change this in the code permanently?

Vin said...

traci griffin photography,

Use WIndows Live Writer.

STACYMT said...

This site is cool and very helpful, i needed to look No further when i came here! Thank You for making things a lil' easier!


Βαβυλώνιος said...


Anonymous said...

Hi Vin, I have a specific problem about uploading photos on my blog. I basically follow the usual uploading procedure (I always have) but it doesn't work. I don't even get an error message after it supposedly finishes uploading them. The images just don't show up on the post. I have been trying to upload several different sizes, number of images at a time etc and it goes to the 'DONE' page but then nothing appears on the edit post page or on the html. And I know I have plenty of space for them in my blog and the images are too small to not upload because of size limitations. I was also able to upload and change the profile and title images but just not add images to the posts.

Could you please point me in the right direction as to how to fix this?

Much appreciated! Thanks!

Vin said...

Indie Rose,

Check the Picasawebalbum for your blog if the images have uploaded correctly.

You can also use the free WLW Post editor to upload images.

Admin said...

hi vin
prob ive got is that when i post pics they r in blck and white when posted but when u clcik the pic thats posted it opens up in colour also with side bar pics.

most people view the site in colour then others view it in blck n white like i do its so annoyin

any suggestions

Vin said...


What is your blog address?

Admin said...

hey vin
its www.britneyaddiction.com


Vin said...


Which browser and version are you using?

Tom Munro said...

I'm new to the whole blog thing. I'm working on a new company blog and I want to allow customers to upload comments and job photos of their new granite countertops we fabricated and installed. Is this possible and can it be don on blogspot. I have my own domain for the blog www.blog.supremesurface.com. Thanks for the help

Vin said...

Tom Munro,

Pictures cannot be seen in comments. They can send you the pictures and you can upload them to posts and put their comments under them.

Alternatively you will have to make them Blog Authors (Settings---->Permissions) so that they can do it themselves.

Lili Tankersley said...

Thanks for this great blog!

I have a common problem but can't find an answer: When I upload photos to my blog, some of them are coming out rotated 90 degrees. I have tried saving them in Paint, and I have tried uploading them sideways, but it doesn't work. Can you help?

Lili Tankersley said...

Thanks for your great blog!

I have a common problem but can't find a solution: When I upload some photos to my blog, they come out rotated at a 90 degree angle. I have tried saving the image in Paint, and I have tried rotating it in an image program, but it still comes out wrong. Can you help?

kem said...

Good day Vin.
Thanks for the good works you guys are doing. More grace.
I was trying to upload picture from my system to my blog but it was telling me :"There were errors during upload.This image could not be uploaded due to an internal error." The picture was originally downloaded to my system from flickr.
What do i do?

Vin said...


Try the more user friendly free Windows Live Writer Post Editor.

Anonymous said...

I'd like to make it so that when I post pictures on my blog you can't see my background image through them...How do I do this?

Vin said...


What is the blog address?

Anonymous said...

my blog's address is http://www.92blue.blogspot.com

Vin said...


In your template scroll down to this code :

#outer-wrapper {
background-color: black;
opacity: 1;
filter: none;
-moz-opacity: 0.900;

Delete these lines only from above code :

opacity: 1;
filter: none;
-moz-opacity: 0.900;

Anonymous said...

Thanks for the help!

Anonymous said...

Good day Vin.
Each time i tried to insall Windows Live Writer Post Editor it comes up with this information: ONE OF THE INFORMATION FILES APPEAR TO BE CORRUPTED.hr:0x800b0004
I have tried several times but it gave thesame information.
What do i do?

What do i do

Vin said...


Check out the Windows Live Writer Help and/or support forums.

mesauser said...


when i post pictures side by side, if i select the pictures to be medium or large, the picture on the right is half way cut off...help! what am i doing wrong? only the small size photos work.

Anonymous said...


when i post pictures side by side, the picture on the left is cut half way off when i select medium size or large...it won't cut them off when i select small. i would like to have bigger pictures side by side...can you help me?


Vin said...


Depending on your picture size you may have to increase blog width.Use the free WLW post editor to easily create tables and post pictures side by side.

Leo said...

Hello, I have made some changes in my blog template to make it wider that I learned from this webpage. When I do this however I do not manage to make the photos I have uploaded to change together with the new width. Do anyone know how to do that? Easily?

Vin said...


Try changing the numbers in the code for the uploaded images. Easier would be to resize and reupload them.

Knit'inCrazee.... said...

I have followed all of the steps you have listed. It says my picture is being uploaded, then it just sits there and does not finish. Is there something wrong with blogger? "HELP"...

Vin said...


Try the free Windows Live Writer to post images to Blogger.

Anonymous said...

how to use images placed in blogs like 2.bp.blogspot.com etc

Hi, i tried placing images present in 2.bp.blogspot.com, 1.bp...., 3.bp...., 4.bp.blogspot.com etc.. in my htm page

i am unable to see those images in my html page, but i am able to see if i copy the source code n paste the same in a browser..

people can you please trace out the problem n help me out

Admin - Yadlapati


Skip to top of post.

Search Blog Before Commenting


Post a Comment

Please use the above search box to search this blog before posting your valuable comments.

Comments posted on Dummies Guide to Google Blogger (Beta) are moderated and will be approved only if they are on-topic and not abusive. Try not to include website URLs/links in your comments. You can email me : drbhatns at gmail dot com for any blogging question. Thanks,


The Blog Doctor The Blog Doctor2 Blog Doctor Home


Tips On Blogger and Latest News.

Skip to top of post.