Add Images and Other Media to a WordPress Site

Media includes images, audio, video and documents. Once you have uploaded your images and files to your Media Library, inserting them into your page or post is easy.

Add an image to the page you're editing

  1. Place the cursor where you want the image to appear; WordPress will display a flashing vertical line.
  2. Select the Add Media tool on the toolbar; WordPress will display the Insert Media dialog box.
  3. If the image you want is in your Media Library, follow the steps in the next section under To insert an Image. If the image is not yet present, first follow these steps for uploading a file:
    1. Select the Upload Files tab at the top of the Insert Media dialog box.
    2. Either drag the desired file from an open folder on your desktop and drop it in the dialog OR Click the Select Files button, navigate to the appropriate folder and select the desired file.
       

Insert an image

  1. Select the thumbnail of the image you wish to insert; WordPress will display a checkmark in the top right corner of the thumbnail.
  2. Select the Alt Text box in the Attachment Details area and enter a text description of the image.
    For example, you might enter "white and yellow tulips in the foreground and Stephens Hall in the background." The point of this text is to make the image understandable to visually impaired visitors via a screen reader. The other boxes in this area are optional, but adding Alt Text is standard practice for responsible web publishing and a terrific way to show your professionalism.
  3. Select the Insert Into Page button to return to the page editor and see your photo in place.
     

The Attachment Details area of your Media Library displays the following information for the selected image:

  • File name, date and dimensions.
  • File URL — shows the location of the file.
  • Title — displays as a tooltip when the cursor hovers over the image in the browser.
  • Caption — displays beneath the image; the selected theme determines the appearance.
  • Alt Text — displays when the browser can't show the image; it is crucial for visually impaired visitors to use screen readers.
  • Description — usually displays on the attachment page for the image, but how this is used is determined by the selected theme.
  • Alignment — controls the placement of image: left, center or right.
  • Link To — determines what content/page will open if a visitor clicks on the image; the Media File setting will cause the image to open in its browser window.
  • Size — controls how large the image will display on your page; options include Thumbnail, Medium, Large and Full Size.
     

Position, edit and delete images

Several options for adjusting an image's position and text wrapping properties are available.

  1. On the Edit Page, select on an inserted image. WordPress will display a small toolbar above it.
  2. By selecting one of the alignment buttons, (left, center, right and none), you can change the alignment of the inserted image.
  3. Selecting the Edit button can change the image properties (described under Attachment Details) or even replace the image with another.
  4. You can remove the image from your content by selecting the Remove button. But, it will still be available in your Media Library for use elsewhere.
  5. When you select an image in your Page or Post, you will also see resizing handles at the image corners. To resize your image, select and drag any handle.
     
Still need help? Consider the Related Articles box on this page or open a ticket. Use the Yes and No buttons below to provide feedback on this article. You can submit without leaving comments or add details on what you liked and what needs improvement. 

 

Print Article

Related Articles (1)

[Students, Faculty and Staff] Within the university's WordPress environment, TU students can create and manage individual/personal websites. As a self-contained web publishing platform, WordPress is a comparatively easy way to showcase your interests, education, ideas and accomplishments on the web. The articles linked below are intended to orient students to WordPress basics, but they apply to faculty and staff use as well.