Skip to end of metadata
Go to start of metadata

Jump to:

Accessing the Image Editor

There are multiple ways to access the Image Editor:

  • Immediately after uploading an image, you will be taken the preview page, where you will find an Edit button on the top right.
  • In My Files > My Images, you can click the Edit link to the right of image. 
  • After adding an image to your Headline, Work, or Event you will get an Edit button next to it:

Depending on how you access the Image Editor, you may get slightly different options. 

This tutorial assumes you are using the Edit link in My Files > My Images. (pictured below)

[jump to top]

Options in the Image Editor

  1. Name
    • This is a required field and can be very helpful in searching for your file once you have built a large library of images.
  2. Alt Text
    • This is a required field; 'Alt text' (alternative text) is used by screen readers, search engines, and when the image cannot be loaded. Describe what the image shows.  If you have any text in your image, you should include it in the Alt text. 
  3. Caption
    • While this is not a required field, it could be helpful to have, as it will appear on/around the image (depending on where it is being displayed).
  4. Replace File
    • If you have a newer version of the file and you no longer want/need the version displayed here, use this tool to replace the file without changing any of the other options.
  5. Manual Crop
    • Choosing any of the options in this menu will open the crop tool, which allows you to set your crop preferences for the selected option
      • Flexslider Full: how an image displays when it is displayed in the photo viewer at max resolution (850x500 pixels) 
      • Flexslider Thumbnail: how an image displays when it is a thumbnail below the photo viewer (195 x 195 pixels)
      • Thumbnail: This is applicable to profile photos, and Publication covers on pages like (200 x 260 pixels)

      • Medium: how an image will display on if selected to be highlighted on the homepage or other parts of the site (415 x 300 pixels)
    • Select the name of the image style you would like to crop.  Drag the box to select the area of the image you would like to crop, then click "Save". 
    • For the Flexslider Full style, you may wish to keep the original dimensions of your image.  In this case, click "Remove Selection".  The bounding box disappears, and you can click "Save". 

All changes made in the Image Editor will affect every instance of the image on the site.


[jump to top]

Specifying an image for a particular style

In the case that the same image cannot be cropped in a way that works for all the styles it appears in, the following instructions show how to have different images for different styles.

  • Download this Photoshop template with all the image styles as different rectangles.
  • Create/resize images or graphics for each rectangle you need to have a separate style.


  • In Photoshop, use File > Save for Web to create a small web image. 

  • Manually crop the desired styles, as shown above. 


  • Voila:


[jump to top]


  • No labels