Adding Images

Adding Images to the Main Region and Sidebar

Instructions

1. Click the Edit button for the Text Area inside either the Main Region or Sidebar depending on where you want the image to load.
2. Click the File Browser tool in the WYSIWYG editor toolbar.
3. You can either upload your own image by clicking the Select files button on the Upload files tab or click the Files listing tab and select one of the images from the photo library on the website.
4. Click the Use selected button located at the bottom of the Select file to embed window.
5. In the Embed file window change the Display as dropdown from File to Image.
6. Depending on what the image is used for you can select a size for the image under the Image Styles drop down (NOTE: For faculty/staff profile photos it's best practice to use the Portrait Image Style).
7. Type in the Alternate text field a short description of what is happening in the image.
8. Once you've finished updating all of the settings for the images click the blue Embed button located at the bottom of the window.

If you need to remove an image click the image and press either the Delete or Backspace key on your keyboard and the image will be removed.

Adding Slider Images

Slider images are typically reserved for your department or office main landing page. We recommend a maximum of three slider photos per page. If you decide to include slider images on other pages, please stick to the three-image maximum. Remember that sliders will add more scrolling depth to your page, which can make already long pages appear even longer on mobile and other smaller devices.

To add a slider image to your page, click on the SLIDER link and then click Select files.

You will be prompted to click to either upload or drag and drop your image from your computer into the select files panel. You can also use an image from the files listing.

Tip: When uploading new images, please use a common naming scheme such as Department Name or Acronym-Image Name (e.g. Biology-Greenhouse; NSS-Orientation1). This will make it easier for you and other web editors from your office or department to locate images that appear on your pages in the Files library.

Images for this section should be sized to the following dimensions:

Width: 1280px
Height: 549px
Resolution: 72dpi

Instructions

1. Drag into your browser or use the 'browse to image' into the upload block or 'Select from the Files' menu
2. Click the image you want and 'Use Selected'
3. Add Alternative Text * and Title which will show up as a caption under the image

   1. When embedding a decorative image (an image that does not present important content nor has a function), enter <none> in the Alternative Text field to signify the image should have an empty alt attribute value (e.g., alt="", sometimes call "null" alternative text). See WebAIM's article on Alternative Text for more information.

4. You can replace the image by selecting the edit button, or remove it entirely from your slider menu with the remove button