Skip to main content area Skip to institutional navigation Skip to sub-navigation

Format an Image

See the Layouts & Styles Guides section for examples of formatted images and the Best Practices section for suggestions on when to use the different options.


Image padding:

  1. Insert an image into the WYSIWYG of a Web Page Content item.
  2. Click on the image to highlight it.
  3. Select the "Insert/Edit Image" button in the toolbar of the WYSIWYG.
  4. In the dialogue box that appears, chose the "Appearance" tab.
  5. In the "Vertical Space" and "Horizontal Space" fields, input a number of pixels that will determine the amount of space around your image.  For instance, if you type in "15" in the "Horizontal Space" field, there will be 15 pixels of white space on the right and left sides of your image.
  6. Continue styling or formatting your image as desired.
  7. Click the "Insert" button at the bottom when you are done.

Watch the video >>


Aligning an image:

  1. Insert an image into the WYSIWYG of a Web Page Content item.
  2. Click on the image to highlight it.
  3. Select the "Insert/Edit Image" button in the toolbar of the WYSIWYG.
  4. In the dialogue box that appears, chose the "Appearance" tab.
  5. Choose either "right" or "left" from the "Alignment" drop down.
    NOTE: If you do not get the effect you want, you can experiment with other alignment options or the location in which you are inserting the image. 
  6. Continue styling or formatting your image as desired.
  7. Click the "Insert" button at the bottom when you are done.

Watch the video >>


Re-sizing an image:

  1. Insert an image into the WYSIWYG of a Web Page Content item.
  2. Click on the image to highlight it.
  3. Select the "Insert/Edit Image" button in the toolbar of the WYSIWYG.
  4. In the dialogue box that appears, chose the "Appearance" tab.
  5. Input a number of pixels in either the text boxes of the "Dimensions" field.
    Note: If you do not want the image to be re-sized unpropotionately, which would cause it to skew, make sure the "Constrain proportions" check box is selected. 
    Also Note: Even though it's not labeled, the first text field is the width and the second field is the height. 
  6. Continue styling or formatting your image as desired.
  7. Click the "Insert" button at the bottom when you are done.

Watch the video >>