Slideshows are a great way to enhance your site or tell a story through images.

CMS: Slideshow Demo.

3 steps to having a slideshow:

  1. Creating the slides
  2. Building a slideshow
  3. Adding it to your page

And perhaps a little preparation

The slideshows require specific image sizes. This helps make for a consistent, engaging presentation on the page. Images may need to be resized and resaved to avoid strange stretching or cropping.

There are four different size options:

  • 680 by 292 pixels - anyone who had a NeonBeige slideshow would use this
  • 680 by 382 pixels
  • 680 by 453 pixels
  • 480 by 320 pixels - for use on pages (articles) with a right sidebar

The image below shows the relative sizes and aspect ratios of those sizes. If your image matches the aspect ratio, which would be likely for the standard photo sizes, the system will simply scale appropriately and the image will look fine.



1. Creating slides

Go to 'Add content' in your gray toolbar at the top of the browser.

Select 'slides'

Give it a title. Titles are for our own reference and will be used when building the slideshow, but otherwise they don't appear.

Click in the box or on the 'Browse' button to bring up a file dialog window, navigate to the images, select one, click 'open', click 'Upload' button.

Optionally add a caption for the slide.

Save the slide. The default size for display after saving is 480 by 320. Don't be alarmed if the image looks odd. The proper size will be set in the slideshow and it will display correctly.

2. Building a Slideshow

Go to Add content.

Select 'Slideshows'.

Give it a title. Again this won't appear anywhere, it's for our reference.

Skip down to "Slides:" in the gray table. Click in the window and start typing the title of your slide. This is an autocomplete field, so after a few letters, slides with matching titles will appear in a list. Select your first slide.

Click the 'Add another item' button and repeat the process.

To reorder, drag and drop a slide using the crossed arrows to the left of the title.

Once all of the slides are added, set the size and settings for the slideshow.

As an alternative to a slideshow, you could display a random image each time someone visits a page. To do this, set the order to random, set paused to yes, and set controls to no.

Publish and Save. Upon saving, you will see the title of the slideshow and the list of slides selected.

3. Place Slideshow on a Page

Either navigate to the page the slideshow will be added and click the edit tab or create a new page.

Place the cursor in the slideshow window and start typing the title of a slideshow. Select the slideshow from the titles that appear.


Once the slideshow is on a page, a small widget appears in the top right (if logged in) which you can click to edit the slideshow. To edit a caption or an individual image, you will need to go to My Workbench to find that slide.