How To Add Images To Your Posts

Pictures rule. They can give your reader additional insight into the topic you are writing about, or help clarify a point in your post. If you put the right image at the beginning of a post it could be the deciding factor that convinces a reader to take the plunge and read the article. Think about it… When you see a list of posts or topics or articles on a website, which ones are your eyes naturally drawn to? That’s right. The ones with pictures.

Fortunately for you, WordPress makes storing images and including them in your posts really easy. My advice is to write up your content first, and worry about adding in the images at the end. Once you’ve got your post written, you can easily add an image by following the steps in this article.

If you’d prefer to watch a video on how to do this, you can find one on the WordPress Video Tutorials page.

The first step is to write your post. Once the content is ready, you need to select where you want the image to land. You usually just want to choose the beginning of a specific paragraph – don’t worry about getting the picture to appear on the left or right, that gets taken care of later.

For example, when I added the next image in this tutorial, I selected the beginning of the next paragraph, and set it to appear on the left after the fact.

To add your image, look above your post editor for a row of icons like the ones to the left. This is your Media Upload menu. The options, from left to right, are Image, Video, Audio, and Media (miscellaneous). For an image you want to click on the the first button.

Hover over them until a title pops up if you are unsure which to choose. This will open the “Add an Image” window. There are three tabs to choose from:

• From Your Computer – Allows you to upload an image from your computer
• From URL – Display an image on the web using it’s URL
• Media Library - Use an image you’ve uploaded in the past

Add Images From Your Computer

This is the option you’ll probably use most. Use the “Select Files” button browse your computer for your image. Once you’ve found and selected your image file, click “Open” and wait for the upload to complete. The larger the image, the longer it will take, but image files generally upload pretty quickly.

Adding Images By URL or Using The Media Library

Adding an image from with a URL or from the Media Library is pretty self explanatory. For the URL tab, just enter the details required (the options are described below). When you click on Media Library, you’ll see a list of all the images you’ve uploaded in the past. Click the “Show” link to the right of the one you want to view it’s options and insert it to your post.

Options

Once the image has been uploaded or selected, you’ll need to set it’s options. Here’s a breakdown of each, and how they are used:

• Title - This title is what appears when a reader hovers their mouse over your image. It is also how the image will be listed in the Media Library. This is the only required field.
• Caption – This is the caption that will be displayed under your image. It will also be used as the text that is displayed in the event that the image is unavailable to your reader.
• Description – Provides a description of the image. Can be very helpful if you have a lot of images in your library.
• Link URL – Use this to specify a web address that you want the image to link to. Visitors will be taken to whatever page you enter if they click on the image. Leave it blank if you don’t want it to link anywhere.

The next option is “Alignment.” There are a few choices here, and I’ll explain each.

• None – The image will display exactly where your cursor was when you hit the “Add Image” button. If that’s in the middle of word or a sentence, that’s where the image will appear.
• Center – The image will be centered in the post with not text on either side. The image is inserted exactly where you select, but the content is split above and below the image.
• Left and Right – These are the two I use the most. The image will be floated to the left or right, and the text will wrap around it. These are what I have used on this page. The top of the image is aligned with the line of text you selected.

Last but not least we have the Size option. There are a handful of preset size options to choose from, including Full Size. If your image is already smaller than one of these presets, you won’t be able to use it. As of WordPress 2.9, there are options to edit your image to a custom size once it’s been uploaded, but that’s a topic for another post.

Once your options are configured just click the “Insert Into Post” button, and you’re good to go! If you need to move the post once it’s been inserted, you can click on it and drag it to another spot in the “Visual” view. It will land wherever your cursor is when you let go, and the alignment will remain the same. Now, I know that was a lot to read, but it’s really easy once you do it a couple of times. Be sure to watch the video I mentioned above for a live demo to see how quick the process is. The video is actually me adding images to this lesson (I did, however, move them a little after I finished the video. Nothing like last minute editing!

Let me know if you have any questions or problems!