How to Add an Image to a Post or a Page

Adding an image to one of your blog posts or web pages is easy.

Check where the image is on your computer and the filesize. Large files take longer to load, so its best to trim down big images to 50-80 Kilobytes. We have some hints on Graphics Tools that can do this if you don’t already have software to do this.

Login to your website and go to Dashboard, Manage, Pages (we’ll assume a page for this example, but it is the same for Posts).

Edit your Page.

Below the Page Title and on top of the text editor, there are some Upload/Insert buttons (just above the yellow Add an Image highlight in the image below.

The first button is Add an Image, and lets you upload images. The second – Add Video – lets you embed videos, the third – Add Audio – lets you add audio, and the fourth button – Add Media – is for uploading other files (such as PDFs, Word or Excel documents).

In this case we’re uploading an image, so click the first icon on the left (the add an image button).

Select images from your computer by clicking on “Select Files ” or images already on the web by entering the URL. If uploading an image from your computer, you can upload multiple images at once by holding the shift or ctrl key (on PCs) or the shift or cmd key (on Macs) while selecting the files. The image(s) will be copied from your computer to your website.

When the images have been uploaded you will be shown this:

This allows you to set some options before inserting the image into your page/post:

• Title – use a descriptive title that explains the image well enough so sight impaired visitors understand what the image is showing
• Caption – if you want your image to display with a caption, enter it here. It is a great idea to use these, as they look good and explain the image). A good Title is often a good Caption as well, so you can copy/paste between these two.
• Description – not used very often, only used in the body of an auto-post if you use the Post URL option below
• Link URL – do you want the image to link somewhere? Enter the URL of a website if you want the image to be a clickable image to the URL. Click the File URL if you want the image to be a clickable link to the full size image file you have uploaded.
• Alignment – Left or Right will float your image to the left or right.
• Size – for larger images, WordPress will automatically create three smaller images for you. Under Settings, Media you can control the default size of the Medium, Small and Thumbnail images that get created. Auto images are only created where they will be smaller than the original.

To place the image into your page, set the appropriate options and click the Insert into Post button. If you chose Right Align and are using the Visual Editor, this is how your image might look:

Now Save your page and view it to see the image.

HTML View

Note: if you use HTML view instead of the Visual view, you will see the HTML link to your image that has been created for you – that is how your image works in HTML. Don’t worry if you don’t understand it, you can switch between HTML and Visual any time.

More on the options for Size and Link URL

You can use the various Show and Link To options to control how the image appears on your page, and what it links to.

You can choose exactly what is displayed on your webpage:

• Thumbnail: shows a small (automatically created for you) version of your image
• Medium: shows a medium (automatically created for you) version of your image
• Full Size: shows the full size image

You can also choose what happens when a visitor clicks on the thumbnail/image shown. You make the image ‘clickable’ using these options:

• File URL: Displays the full size image file when the image is clicked.
• Post URL: Displays the full size image in a new page when clicked – this allows visitors to comment on the image.
• None: Doesn’t display anything when the image is clicked. So if you Show the full size image, the image isn’t clickable.

Alternatively, you can manually enter any URL in the Link URL field and the image will link to that.