Expand Article

Last Updated: 12/10/12


This article explains how to add or edit an image in a rich content block. If you are trying to add an image to a slideshow block, please see Adding/Editing a Slideshow.

Quick Start

  1. Select the Rich Content block where you would like to insert an image and open it in Edit Mode (see Getting Started). In the content area, place your cursor where you would like to insert the image.
  2. In the Content Controls, click on the Insert Image Icon, the Insert Image dialog box will appear.
  3. If your image is stored in the Files area of your site, click on the Browse button and select your image. (See Upload and Organize Files).
    • If your image is hosted on a different server, you may type or paste the URL to an image in the text box provided.
  4. Choose your Image Options and click Finish to insert your image onto your page. (for a further description of Image Options, see below).

Image Options

  1. The Image Floating / Text Wrapping option lets you control how text will display around your image.
  2. The Image Padding drop down box defines how much padding you would like around your image. (Padding is the amount of space between the image and other content.)
  3. The Image Border option box defines the width of a border (use 0 pixels for no border).

Resizing an Image

  1. Click on the image and handles will appear on the sides and corners.
  2. To keep your image proportionate, click and drag the corner handles until your image is the size you would like it.
  3. To stretch your image, click and drag a handle in the middle of one of the sides, top, or bottom of the image.

  4. About image size

    • It's best to use images that have been resized to the size (or close to the size) you want them to show on your page.  Large images can slow down the time it takes for the page to load.
    • For example, consider an image that is 3000 by 1500 pixels.  That is huge for the web (it wouldn't fit on most screens), but very common for today's cameras.  Let's say that large image is placed on a page and is set to display at a common web size such as 300 by 150 pixels.  Even though the image is showing in a small area, the web page has to load the large-size image, which may have a file size 100 times larger than it needs to be.
    • Re-sizing your images for the web can be done using very simple image editing software.

Moving an image

  1. To move an image within your content, simply click and drag the image to a new location.  Dragging an image will not change it's floating behavior (left/right alignment).
  2. Note: You can only move an image within the content block you are editing. You may not move it to a different content block.
Back to Top