Add an Image

Please Note:

Currently, the maximum size permitted for a single file is 8MB and you are limited to a small set of file types for security reasons. Want more options? Check out Large File Storage or Storing Files on Google Drive.

Uploading your file

  1. Open your page/post for editing in the WordPress dashboard.
  2. Place your cursor in the visual editor where you would the image/file to appear in your content.
  3. Choose interface A or B to upload the file.

A. Drag & drop interface

Find the file on your computer, and click & drag it directly into the WordPress editing interface. Your editing area should flash blue, like the screenshot below, as you are dropping the file into place. You can upload multiple files at once this way.

drag-upload

B. File upload interface

Click the “Add Media” button (red arrow, below), which will launch a popup/dialog window.

editor-add-media

Click on the “Upload Files” tab  (red arrow below) if it’s not the selected tab, then drag and drop your file(s) into the popup dialog, or click the “Select Files” button to browse for files on your computer.

upload-files

Assign options

Next, you'll have a chance to add information to, and choose options for, the image you uploaded.

insert-media

Title

By default, the image title will be your file name, minus the file extension (e.g. .jpg). You should change this to something more descriptive, especially if your file name was created by a digital camera (e.g. IMG_2911.JPG). You can use the title to search for your image later, so include memorable keywords. The title will be used as the alt text, if no alt text is explicitly provided.

Caption

Optional. The caption will appear below your image in italics on a pale blue background. This will be used as the alt text, if no alt text is explicitly provided.

Alt Text

Alt text tells someone who's using a screen reader (i.e. the visually-impaired) about your image. It's also displayed if your image fails to load (slow internet connection). If you leave this blank, the caption will be used, or if there’s no caption, the title.

Description

Optional. Descriptions are only seen by users if "Link to" is set to attachment page. Rarely used.

Alignment

The alignment controls how the page content and the image interact. "None" puts the image on a line by itself; the other options wrap text around the image.

Link to

What happens when you click on the image.

  • Custom URL: clicking on the image sends you to the URL you enter.
  • Media file: the WordPress default. Clicking on the image brings you to a new blank page with the full-sized version of the image.
  • Attachment page: clicking on the image brings you to page that shows the image at medium size, with the description text below it. Rarely used.
  • None: clicking on the image does nothing. Recommended if image is small enough to display full-sized on the page.
  • If you'd like the image to open up in a popup window instead, find out how to use fancybox

Size

When WordPress uploads your image, it makes several versions of it at different sizes. Select the size you'd like to use on this page. Typically, the dimensions are as follows.

  • thumbnail = 150 x 150 px
  • medium = 300 x 300 px
  • large = 1024 x 1024 px
  • full = whatever size the original image was

Smaller images may not have a medium or large option. You can see exactly what the sizes are for your site by looking under Settings -> Media on your dashboard.

Insert into page/post

insert-to-postThe image is uploaded, and in your media library now, but it's not on your page/post yet. Make sure to click the blue "Insert into Page" or "Insert into Post" button at the bottom of the screen - this will place the image where you initially had your cursor before uploading the file.