Changing Image Layout

To change where on the page your image appears is based on two things:

  • Where the image is placed
  • How the image is aligned

Let's go through each of these...

Where the image is placed:

When you insert an image into your post, it is placed directly where your cursor was (in the content of your post) when you clicked the "Add Media" button. It will literally jump in the middle of a sentence if that's where your cursor was.

Don't worry though, you can drag the image around in your content after it's been placed. You just need to click on the image and drag it to where you'd like it to appear in the content. It can be a bit tricky to see, but you will be able to see the cursor beneath the image as you drag it, identifying where the image will be placed. Take a look in the following image...

 

 

Quick Tip (for the coders out there!)

If you're competent with HTML editing you will also be able to click on the "Text" view at the top right of the editor, and copy / paste the image element ("<img />") where you'd like in the content also. But be careful not to break the structure of your contents existing html syntax.

 

How the Image is aligned:

Once an image is placed within your content, you then ave the option of changing it's alignment, think align left / right / center etc. To edit this, click on the image and you will see the image alignment tools appear...

 

 

The options from left to right are:

  • Align Left (In-Text) 
  • Align Center (No Surrounding Text)
  • Align Right (In-Text)
  • Align Left (No Surrounding Text)
  • (Edit Image Options)
  • (Remove Image)

Choose the option you want, and preview/publish your post to see the result.