Posts

How To Insert Images into WordPress Posts and Pages

Including images in an article is the best way to illustrate your ideas. Adding Images make your content interesting and make readers more engaging. WordPress makes it really easy to add images to your posts. In this article we will discuss how to insert images into WordPress posts (or) pages.

  1. Create a New Post/(Page), or Open an existing Post/(Page)

    To create new Post, from your wordpress Dashboard go to Posts>>Add New (To create new page, go to Pages>>Add New ).

    Add New

    Add New

    Note: If you want to add image to an existing post, open your  post. Go to  Posts>>All Posts>>click on the post’s title to view the edit page.

    Edit Post

    Edit Post

  2. Click the Add Media button

    Now you are in the post-write screen. Place your cursor where you want the image to appear and click the ‘Add Media’ button.

    Add Media

    Add Media

    Now you will see insert media screen. To insert image, you have following 3 options.

    insert image

    insert image

  3. Insert Your Image

    • Upload From Computer
      First let us see how to upload images that are already saved on your computer. Click on upload files>> Click on the ‘Select Files’ button.

      Select files

      Find image file from your PC and click on Open button. Wait for WordPress to upload and crunch  the image. Click on the blue Insert into post button to add the image to your post.

      Insert

      Insert

      Note: After uploading an image from your PC, You will see a number of options(attachment details and attachment display settings) on the right hand side. You can either use the default setting displayed there >> Click on the blue Insert into post button or see how to use these settings .

    • Insert from Media Library – If you already have uploaded images and have a Media Library in your blog, select from any  images in the media library by clicking on it, click on the blue Insert into post button to add the image to your post.
      Insert from Media Library

      Insert from Media Library

      Note: After selecting an image from media library, you will see a number of options(attachment details and attachment display settings) on the right hand side. You can either use the default setting displayed there >> Click on the blue Insert into post button or see how to use these settings.

    • Insert from URL

      Insert from URL

      Insert from URL

  4. Different settings for uploaded image – after uploading an image from your PC (or selecting an image from media library), You will see attachment details and display settings on the right hand side of the media up loader interface.
    Attachment details:
    Attachment Details section displays:

    • A small thumbnail of the image
    • File details
    • A links that allow you to Edit Image
    • A links that allow you to Delete image from your site.
    • Enter the title of this media.
    • Enter a caption that will be displayed below the image.
    • Enter the Alt text for the image to describe the media.
    • A description for this particular media.
    Image details

    Image details

    Attachment Display settings

    Display settings

    Display settings

    Alignment

    The Alignment setting controls where your image will be displayed and how it interacts with content on the page.

    Align

    Align

    Link To You can create different types of image links here.

    • Media File: This is default option.This will automatically link to full-size version of the file.
    • Attachment Page: Links your inserted image to its WordPress media attachment page.
    • Custom URL: Allows you to set a custom link URL for your inserted image
    • None: This setting will remove the link completely.

    Image size – The Size settings determine the size of the image you are adding to your site.

    Image Size

    Image Size

How to edit Image Attributes in an existing WordPress Post

You can always edit different image attributes such as the alignment of an image or alt/title/caption/description text of an image that already inserted in a post. Open the post in the post-write screen(follow step 1 on this page). Make sure that visual editor tab is selected. Click on the image you want to edit. You can see two icons over the image. The left icon (pencil Image) allows you to edit the image properties and the right icon (X Image) will delete the image from your content.

edit image

edit image

Click the edit image icon to edit the image properties. A  pop-up window will appear and you can edit the various image  properties there. The Edit Original button allows you to do some simple manipulations such as Crop, Rotate, Scale, and Flip Images. The Replace button allows you to replace the image entirely.

edit attributes

edit attributes

After making changes, click the Update button to save your changes. If you do not want to make any changes, click the small ‘x’ in the top-right of the pop-up window to close the pop-up.