Quick Tip: Setting Up a Basic Slide Show

Using GoLive's SlideShow action to set up a basic slide show which allows users to navigate backwards and forwards through the images in the slide show is really quite easy. We will go through the necessary steps here. All the images used in this slide show are public domain and come from www.PDImages.com

There are a few things to keep in mind before starting. Firstly, all the images need to be in the same location. You cannot have a couple of images in one folder and couple of others in a different folder. Secondly, you need to name the images in a numerical sequence. Here we have used 001.jpg, 002.jpg etc. Lastly, the images must all be in the same format. You can't mix JPEGs and GIFs. Its one or the other.

It says in the Online Help for GoLive CS that you can't have two SlideShow actions on the same page. But the backwards and forwards navigation described here is based on using two SlideShow actions and it works in every browser its been tested on so far. So, maybe they meant you cannot have two slide shows on the same page (which I haven't actually tried). Or maybe the Online Help is just wrong.

You can find the finished slide show itself here: Basic Slide Show


Step 1:
Gather your images, add them to the GoLive site in a single location and make sure they are named following the rules set out above. (I'm presuming you already know how to get new files into a GoLive site here.)


Prepare the Slide Show Files


Step 2:
Place the first image of the slide show sequence on the page where you want your slide show to appear. That will be the base image of the slide show.

The image needs a name so that the Javascript used for the slide show can reference it properly. This is done on the Basic tab of the Image Inspector in GoLive CS, and in the More tab of that Inspector in earlier versions. (Mouse over the link underneath the CS image shown to see the GoLive 6 Inspector.)


Name the Base Image
Mouse over this text to see the GoLive 6 Inspector.


Step 3:
Next, you need to link the text or the button images the user will use to navigate your silde show. Here I used text. Select the text (this is my move forward through slide show link). Then create a link for it using the hash sign. (Since my text is in a table here, the Inspector also shows the table elements as tabs. If your text is not in a table, you won't see the other tabs, but you will be able to link it with a hash sign as shown here.)



Creating the Navigation

Step 4:
With the navigation text or image still selected, open the Rollovers & Actions palette (simply the Actions palette in versions of GoLive prior to GoLive CS). Select the Mouse Click event and click on the New item icon. Once you do, the greyed out Action button shown at the bottom in the screenshot for this step will become active. Click on it and choose the SlideShow action from the Multimedia section.




Step 5:
After you have chosen the action in step 4, its time to set up its parameters. First, choose the base image. The drop down will give you the name that you chose for your initial image in Step 2. If you have any other named images on the page, their names will also appear in the drop down menu. Make sure you choose the right one.

Set the number of images included in the slide show/

Set the options. Here I have chosen to allow the user to loop back to the first image in the show when they are at the last image and click on my forward link .

Action Setup

Step 6:
Having set up the forward navigation for my slide show, I repeated steps 3 through 5 to set up backwards navigation. The only difference is when I set up the action on the backward navigation link, I chose the Play backwards option. Since I allowed looping forwards, I also allowed looping backwards.



It really is that simple.