Banner Image  # 1 Sample
Banner Image  # 2 Sample
Banner Image  # 3 Sample

Creating a Carousel

The carousel widget can be used in the new or the legacy template. It can be used in place of a banner image bank or a SPIF bank. 

Upload all the images for your Carousel widget

All images used in your carousel must first be sized appropriately and uploaded to the images folder: _files/images/YOUR FOLDER.

Create new Carousel

  1. Go to _widgets/YOUR FOLDER/carousel.
  2. Click New/widget/Carousel.

Add content

  1. Change: System name (use lower case, no spaces)
    Display name (This is not required.)
    Title (This is not required.)
  2. Choose a Display Type: Choose if you want to show only one random image at a time, or to show a constantly changing slideshow of images. The slideshow allows you to click through to see the whole collection of images.
  3. Add Slideshow Settings: When the banner bank is a slideshow (not a random single image), you can now change the type of transition (push, slide, or fade) and the speed of the transitions in milliseconds (1000 ms = 1 second).
    Screenshot of the banner image bank option for Display Type: Choose the banner display type from Random Image or Slideshow displays
  4. Add Image: Click on the [search] to browse through Cascade to find the image you want to add.
  5. Add Mobile Image: Click on the [search] to browse through Cascade to find the image you want to add. (Recommended size 600px wide by 600px tall.) You will have to create a separate version of the image and upload it to Cascade.
  6. Link (optional): Link this image to another Cascade page, a file, or an external page. This makes the entire image clickable.
  7. Add ALT TEXT: Add a short description about the contents of this picture. If your banner image contains any text (announcement, promotional, etc), then said text must also appear in the ALT text field to meet accessibility requirements.
  8. Add Caption (optional): Add a caption if you want. It is not required. The caption will display as a comment across the bottom of the picture.
    Screenshot of the banner image window showing steps 3 - 8.
  9. Click on the green + in the top left corner to add as many more images as desired.

To Change Image Order

  1. Use the arrows to move an image up or down in the sequence.
Screenshot of banner image bank reordering arrows, highlighted on the left.

Finish Up - Submit and Publish

  1. Click on Submit to save your work.
  2. Publish (or send the request to publish). Note that the individual images must be published as well as the banner image bank widget itself.
  3. The widget is ready to be added to your page.