Inserting Images into Pages and Posts in WordPress

If you're creating a Post or Page (or even editing an existing one) you may want to include an image to enhance your content. Fortunately, WordPress makes it very easy to upload and insert an image "on the fly" as you're creating your content.

Place your cursor where you want to insert your image an click the Upload/Insert Media button above the TinyMCE toolbar.

This will bring up the Add Media window showing three options for adding an image to your Post or Page:

From Computer: You can drag and drop files from your local computer or use a traditional file upload dialog box. If you have any trouble with the drag and drop interface, try using the browser uploader instead.

From URL: Use this to link to an external image. Make sure the owner of the site you are linking to approves this method. Many sites enable Hotlink Protection to prevent others from linking to images (and other media) and all you will see is a broken image instead of the image you wanted to include.

Media Library: If you have images already uploaded to your WordPress Media Library, you can select from those images.

For this example I'll use the drag and drop interface.

This may take a minute or two, depending on the size of the file(s) and how many images you are uploading. Once you see the image appear under the drag and drop area you can begin entering optional information such as Alternate Text, Caption, and Description.

You can also choose your image alignment and the size of the image. Click the "Insert into Post" button when you've filled in any information you want to. If your theme has support for featured images and you want to use this as a featured image, you can click the "Use as featured image" link before clicking on the "Insert into Post" button.

Please note, depending on the size of the image you are uploading, certain size options may or may not be available. WordPress has defaults set for each size and if your image is not larger than the default for a size, then you will not be able to choose that size. In this example, my image is only 110 x 119 (pixels). Consequently, I only have the Full Size option as 110 x 119 is smaller than the default Thumbnail, Medium or Large sizes.

It's also worth noting that if you want to change the default for image sizes, you can do that in Settings > Media in your WordPress dashboard.

Now our image is inserted into our content.

Click the "Publish" button to publish the Post or Page. If you're editing (instead of creating a new Post or Page) you'll want to click the "Update" button to publish your updates. View your Post or Page to see the image.

The WordPress Codex also contains some great information on styling images. It's not required for inserting images, but can really add some special touches to your images.