Images & Blogging Part 1: Adding Images to Your Blog Posts

Blogging is esentially easy. Formatting your blog posts so they have some style and flavor is a bit more difficult. One of the more important elements in blog posts are graphics or images. These serve to both break up the text, and to add interest to your articles. I thought it was important to write a post covering how to place images in your blog posts to help out all those people who have been having trouble doing so (see disclaimer at end of post). This tutorial will focus on WordPress blogs, but it will have alternatives for other blog software as well.

When Should I Use Images in my Posts?

I find that the best use of images are when they are directly related to what you’re writing (e.g. if you’re writing about flowers, then use images of flowers), or when they are somehow metaphorically related (e.g. I wrote an article Are Alexa And DMOZ Down For The Count? and used the image of a boxer to go with it). This is not to say that you can’t use images otherwise, but when these situations come up, I think it is a given that you should.

I discovered a blog a few months ago called DoshDosh that uses images with every post. Maki’s use of manga images keeps his blog colorful and interesting (not to mention his articles are extremly well written and thorough). In this case, placing themed images with all his posts works to build some interest and break up the monotony of the page.

How to Add Images to Your Blog Articles

There are a few ways to add images to your articles using WordPress.

I. Use Image Hosting Services to Host Your Blog’s Images

The first way to add an image to your post is to use some kind of image hosting service. Nirmal T V wrote a great post the other day where he shared the Top 5 Image Hosting Services and gave detailed explanations of each. Any of the ones he listed, including: Flickr, Photobucket, Picasa, Imageshack, and Yahoo Photos, or any other online image hosting service will work for you.
How to Add an Image to Your Articles with Free Hosting Services

1. Pick a hosting service and register or log in
2. Find the Upload button or link
3. Click the browse button which will allow you to search your computer for images and click on the name of the image you want to upload.
4. Add details about the image as asked by the website.
5. Voila! Your image is now hosted.
6. Click on the image with the right button (or for your Mac users do it while holding control down) and select “Copy Image Location.” Your image’s location will now be in your computer’s memory.
7. Go to your blog post, and where you want to add your image (be sure you’re not using a WSIWYG editor. In wordpress, this means click on the CODE Tab if you’re writing our post with the VISUAL tab active),
   

   enter the following, replacing “PASTE IMAGE LOCATION HERE” with the actual location (use control-v or in your browser’s menu options go to edit, then paste):
   
   <img src=”PASTE IMAGE LOCATION HERE”>

8. Congrats! You now have an image in your article. Click “Save and Continue Editing” at the bottom of the text box where you write your blog entries, and you’ll be able to see your image in the preview window as you scroll to the bottom of your browser window.

II. Using Wordpress to Add Images

Wordpress makes it very easy to add images to your website.

1. Decide where in your post you want your image to appear and click there.
2. Find the following area of your wordpress control panel (while writing or editing a post):
   

3. Click the browse button which will allow you to search your computer for images and click on the name of the image you want to upload.
4. Once you’ve clicked on the file, you’ll want to click the OPEN button in the pop-up window. You’ll see something similar to:
   
   

5. Fill out the title and description boxes and then click on the UPLOAD button. Your browser will upload the image and you’ll see the following:
   
   

6. Click on the button options that you’d like, then click on SEND TO EDITOR
7. The source code for the image will now be set and you’ll have an image. Save and preview your post and you’ll see your image!

Stay tuned for additional posts in the Images & Blogging Series:
Part II - Photo Formatting & Advanced Photo Layouts
Part III - Where to Find Images & Proper Use

Disclaimer: This post is dedicated to my friend Charles Feldman who has been asking me to teach him this for a long time now. Hope this helps!