I’m going to show you just how easy it is to edit a banner slideshow in your Singlepage website.

My demo site has a banner slideshow near the top of the page. It currently has 3 slides.

In a separate browser tab, I’ll login to the admin area of the website ... then click on the Home page link ... and scroll down to find the Slideshow Banner. I click on the name of the region, Top 1, to open the editing screen.

This has some Help text at the top and then an editing area below, where I can see small versions of the 3 slides in the slideshow. If I hover over these small thumbnails, I'll see a larger version of each photo.

Adding a slide

First let's quickly add another photo into the slideshow. I'll click on "Add Another" and then "Choose File". This allows me to browse on my computer to find a photo - I'm going to choose this one. Back in the editing screen, the photo filename is now displayed here but the photo has not been added into my slideshow until I click "Save Changes".

It’s very important after making any changes that you check the public front-end of the website. Back in my original browser tab, here is the website currently still showing the slideshow with 3 slides. But I'll then refresh the page by clicking the "Refresh" or "Reload" button in my web browser. The page will re-load and the slideshow now has 4 slides.


Problems can happen if your photo is too small (paradoxically, this usually results in it being displayed too large on the website) and it may break out of the letterbox shape for the banner slideshow. If the photo is much too large, such as a very high resolution photo from a new digital camera, you may see a memory error and the photo will not be uploaded.

If you have any problems at all, check out the help text at the top of the editing screen. This has some important advice about the size of the slides. For a banner slideshow the photo you upload should be at least 960 pixels wide AND at least 300 pixels high. It's OK for it to be larger than this - the system will re-size your photo and crop it if necessary when you upload it. Your photo may possibly be cropped in a way that doesn't work well for that particular photo. This part of the Help text will resolve most of your image problems: "If you want more control over how your images are resized, or if you have any other problems uploading images, crop and scale them to exactly 960 pixels wide by exactly 300 pixels high before uploading."

Changing the order of slides

Also in the editing area, we can change the order of slides. Hover over the number of the slide, click and drag the slide to a new position in the slideshow and then click Save Changes. Go to view the public front end of the website, refresh or reload the page and you will see that the slide is in the new position.

Deleting a slide

Similarly, if you want to delete a slide, you do that in the same editing area. Let's delete the new slide. Click on the X beside the thumbnail, or tick the "Remove image" box, then click Save Changes. Go to view the public front end of the website, refresh or reload the page and you will see that the slide has been deleted.

And that was a quick introduction to editing a banner slideshow.