University Marketing & Communications

February 14, 2013

Insert new images into WordPress posts and pages

By University of Washington
  1. Make a new Page or Post, or edit an exiting one.
  2. Place your cursor where you would like the image to appear, then click Add Media.
    • Insert Images: Click Add Media
  3. A pop-up box titled “Insert Media” will appear. Make sure you are in the Upload Files screen, and then click the Select Files button.
    • Insert Images: Click on Select Files button
      Click image to enlarge.
  4. Navigate to where you have saved your image, select your image and click Choose.
    • Insert Images: Find your image and click Choose
      Click image to enlarge.
  5. The Media Library screen will open with an “Attachment Details” pane. In the Attachment Details pane, you will have a square preview of your image with fields below to edit and enter information (Note: Because the image preview is square, part of your image may appear to be cropped. Don’t worry, it is not.)
    • Insert Images: Image upload window after your image has been selected
      Click image to enlarge.
  6. In the Title field, enter a short description of the image. (Note: Filling out this field will make it easier for you to search and find the image in WordPress at a later date.)
    • Insert Images: Fill out the Title field
  7. Optional: Fill in the Caption field with the caption you would like to appear with your image.
    • Insert Images: Fill out the caption field
  8. Enter a short description into the Alternate Text field. This text can be the same as the Title field.
    • Important: This field must be filled out to ensure your site follows accessibility standards.
    • Insert Images: Fill out the ALT text field
  9. Optional: Fill in the Description field. The text you enter in this field will not appear on the live site, but it is a good place to add notes or to add keywords that will help you find your image when searching from your WordPress dashboard.
    • Insert Images: Fill in the description field
  10. Fill in the Image Credit field with the photographer name or source of your image. This is usually optional, unless you are using an image that requires a source credit.
    • Insert Images: Fill out Image Credit field
  11. Select how you want your image aligned with text.
    • Insert Images: Select image alignment
  12. Optional: Select an option in Link To.
    • Insert Images: Modify the image link
    • Custom URL: Select this option to have your image link to any URL of your choosing. Enter your chosen URL in the field below this drop-down menu.
    • Media File: This is the default option. Your image will link directly to the full-sized version you uploaded.
    • Attachment Page: This will link to a WordPress page that contains only your image.
    • None: Selecting this option means the image will not direct users to another URL.
  13. Select your image size. See below the screenshot for a description of each size option.
    • WordPress will automatically compress and crop large images and optimize them for the web. This means you can upload one image file and insert it in multiple areas and in different sizes on your site.
    • Note: If the button for an option does not show in the drop-down menu, this means the image you uploaded does not have dimensions large enough for that option. You will need to upload a larger image if your desired option is not available.
    • Insert Images: Select your image size
    • Thumbnail: A small (150 x 150 pixel), square crop of your image.
    • Medium: A medium-sized version that is not cropped. The longest side of your image will be 300 pixels.
    • Half Width: A custom size optimized to fill half of the body width of your page or post. The width will be 310 pixels and the height will scale.
    • Full Width: A custom size optimized to fill the body width of your page or post. The width will be 620 pixels and the height will scale.
    • Large: A large-sized version that is not cropped. The longest side of your image will be 1024 pixels.
  14. Click on the Insert into Post button. This will save all fields you filled in earlier and insert your image into your post or page.
    • Insert Images: Click Insert into Post
  15. Your image will now appear in your post or page with the information from the fields you previously filled out and the settings you chose.
    • Insert Images: The image is now in a WordPress post