Web & Video

Cascade: Inserting Images

Inserting Images into Cascade

Cascade allows you to enhance the content area of your webpage with images. Images are easy to include on your page – there are three main steps to the process.

  1. Resize/Prepare the image
  2. Upload the image
  3. Insert the image on the page

1. Resize/Prepare the Image

Most images from a digital camera are physically large – they need to be resized to fit on your webpage. It is best practice to resize your image before it is uploaded to Cascade. You should not resize your image using html because the large image will still be downloaded and then resized – this can cause page load delays. To resize your image you will need to use an external software package. Photoshop is a good tool for resizing images and Wesleyan has a keyed version of it – you can speak with you desktop support about getting it installed on your desktop. There is an image editor within Cascade but it is strongly recommended that you don’t use it because it alters the image properties (it changes the colors of the photograph.) There is online documentation available about cropping/resizing your imageson the New Media Lab Blog.
Remember to use good naming conventions when naming your image. Generally the best names are all small letters, can include numbers and contain no spaces or special characters. Be sure that you keep the file extension on the filename – .jpg, .gif or .png.
It is good practice to keep your Cascade area organized — and this applies to your images. It is recommended to store all of your images together in an images folder. You can also put subfolders within the images folder to further organize your images.
Once your image is resized you are ready to upload it to Cascade.

2. Uploading an image to Cascade

To upload an image to Cascade, first locate the folder within Cascade that will host the image. Usually, this folder is named images. If one does not exist, you should create one.

– Creating a folder named “images”:

  • Click on Base Folder
  • Select New > Folder
  • Under the System Name field name the folder “images”.
  • Uncheck the Include when Indexing box (you don’t want this folder included in your navigation)
  • Click Submit
  • You will see the images folder in the list in the left column

– Uploading an Image

  • Click on the folder named “images”:
  • Select New /Image or file
  • Under the Data section, select Browse to locate the image to upload.
  • Locate the image.
    note: do not change the name of the images during the upload and be sure the image name has the proper file extension
  • Click on the Submit button.
  • Your image is now uploaded to the “images” folder in the Cascade system.

3. Inserting an Image in Cascade

  • Edit the page that will contain the graphic.
  • Click your mouse/cursor on the page where you would like the image to appear.
  • Click on the Insert/edit Image button. 
  • You will see a pop-up window.
  • Select the Browse button. 
  • Locate the desired image.
  • Select Confirm
  • The Alternate Text field is required. Enter text that generally describes the image.
  • Click Insert and your image will appear.

– Advanced Image Options:
Once an image is uploaded to Cascade you can align the image to the left or right.

  • Using the left or right alignment options allows the text to flow around the image (like a magazine style layout)
  • Select the image you want to align.
  • Click on the Insert/edit Image button. 
  • Click on the Advanced tab at the top of the window. 
  • Click the dropdown menu next to Alignmentto see the various alignment options.
  • Select the left or right image alignment option and click  at the bottom of the window.
  • Alternatively, you can also right-click an image, roll over the Alignment option and select the designed alignment, as shown below.