Tutorial Tues - adding pictures to blog posts

Welcome to Tutorial Tuesday! I asked a couple of weeks ago about topics for tutorials and Slyv asked how to post pictures on a blog. Well there are a couple of ways. First up is the technique using blogger to host you're photo's. So let's look at that way today. I also get asked a lot how I add photo's to make them centered and the text not wrapping around the photo, and I'll address that in this post too!

Step one: click "new post" in your blog and we'll get going from there. If you look at the bar above the new post area there is an icon that looks like a photo, when you hover your mouse over it, a text box will appear with "add image". Click on this icon.

Step two: Once you click the icon a pop-up box will appear for you to add your photo's. Let's begin by adding one photo. Click the "browse" button to search for the photo on your hard-drive.

Step three: Another box should pop up where you can browse through your hard-drive for the photo you wish to upload. Once you highlight the photo (by clicking on it) simply click "open".

Note: When I save my photo's/pics after editing I save 3 versions, one large, one small, and one with my watermark for the WEB. The WEB one is usually around 100kb.

Step four: Once you have chosen your photo you need to make a few options of the layout of the photo. My own personal choice is for Centered photo's, it just looks nicer in my opinion. Another reason for choosing this option is blog readers viewing your blog in different browsers. The left and right justification with word wrapping just doesn't seem to work well in Firefox browser. It tends to have the text over some of the photo so I elect not to use either of these options. I also check the "medium" box. Then click "upload image".

Step five: Once you click the upload blogger will connect and load. If it doesn't this could mean that either your file size is too big (see my note above about loading files of approx 100kb in size) or that blogger is down for a while. Sometimes blogger has outtages, so just try again later. Once the image has been added you'll see the box below, where you just need to click "done" to continue.

Finish: Once the image is uploaded, you can continue editing your post as usual. Using the "center" option means you'll get no text to the right or left of the image just above or below. [Like this post]

Another option for Step 2: Blogger has the ability to add multiple images at once. If like me you want to post lots of images on certain days (sketch days!!!) then this is a great feature! At the top of the initial pop-up box is a link saying "Add another image". You can upload up to 5 images at a time by just repeatedly clicking this box. Then browsing and adding images as before.

Once done you'll end up with a blog post similar to this one. With multiple, centered images and no text wrapping.

Hope this helps! Any more questions or tutorial suggestions just post in the comments or email me


Di