A Slideshow is a User Item that adds a slideshow to a Custom Page. The slideshow shows a series of pictures in sequence, and may include controls to pause and resume the show, or jump to a specific image.
You can see example output from the Slideshow User Item further down this page and also on the Second Site demonstration site.
You designate the images you want in the slideshow by assembling them in a subfolder of the Input (-i) folder. The Slideshow User Item is designed for pictures that are all the same size; mixing different sized images will not produce good results.
You may add multiple slideshows to a single Custom Page, but use caution. Each slideshow adds work for the browser where the amount of work depends on the size of the images and the animation settings. If you add multiple slideshows to a single page, the browser may not be able to keep up.
The Slideshow User Item includes 28 different effects that control the transition between slides. You can see how the various effects work using the following demonstration.
User Item Example
- Family Pictures
- Thanksgiving Pictures
The diagram shows a Custom Page named "Family Pictures" with two nested User Items, a heading and a slideshow.
The Edit Slideshow window controls the properties associated with a Slideshow User Item.
See Enabled on the User Items page.
Title and Show Title
Slideshows must have a Title, but the Title may or may not appear on the page. If Show Title is checked, which is the default, the title text appears above the slides.
The Folder property determines which folder contains the images included in the slideshow. The folder is selected from a pull-down menu that includes all the subfolders in the Input (-i) folder.
To create a slideshow, you must create a subfolder in the Input folder. Images will appear in alphabetical sequence by the filename, so assign names that produce the sequence you prefer.
The Width property determines the width of the slides on the output page. You must specify a width.
The height property determines the height of the slides on the output page. You must specify a height.
The Alignment property determines how the slideshow container is positioned relative to other content on the page. The slideshow container includes the title (if any), the thumbnail list (if any), the current slide, and the slideshow controls (if any). You can float the slideshow container left or right, or you may center it. When the container floats left or right, other content may flow to the other side of the container.
See Clear on the User Items page.
Show Image Caption
If Show Image Caption is checked, Second Site will extract captions from the image files in the slideshow folder and display the appropriate captions when an image is the current slide. The caption will appear beneath the current slide.
The slideshow container must have a fixed height. If Show Image Caption is enabled, the slideshow container must be tall enough to allow room to show the caption beneath the slide. The height is specified in pixels. The default is 40, and 40 pixels should be enough to show about two lines of caption. The line width is determined by the width of the slide images.
The Effect property controls the transition between slides. You select one of the 28 available transition effects from the pull-down menu. You can see how the various effects work using the demonstration earlier on this page.
The speed: parameter controls the speed of the transition. The speed value is expressed in milliseconds, so "1000" is equal; to 1 second and "500" is equal to half a second.
Time per Slide
Start Show on Load
If Start Show on Load is checked, the slideshow will automatically advance from one slide to the next as soon as the page is loaded. If you do not include the slideshow controls, you should enable Start Show on Load or the user will have no way to move from slide 1 to the other slides.
The slideshow may include a set of buttons to control the slideshow:
The left button moves to the previous slide. The right button moves to the next slide. The previous and next buttons may be used whether the show is playing or not.
The middle button changes based on the context. When the slideshow is playing, the button may be used to pause the show. When the slideshow is paused, the button may be used to restart the show.
If Controls is set to "none", no controls are included in the slide container. If Controls are set to "Top", "Top, Bottom", or "Bottom", the controls will appear in the indicated position(s).
Pause Show on Hover
If Pause Show on Hover is checked, the user can temporarily pause the slideshow by moving the mouse over the slide. If you include the slideshow controls, the Pause Show on Hover checkbox is disabled and the user may only use the slideshow controls to manipulate the slideshow.
The Position pull-down menu controls the location of the thumbnails relative to the slideshow picture. If set to "None", which is the default, no thumbnail images are displayed. If set to "Left" or "Right", thumbnail images appear to the left or right of the slideshow picture, respectively.
Thumb Width and Thumb Height
The thumbnail width and height are determined by the Thumb Width and Thumb Height values.
The List Width property determines the width of the list of thumbnails. It must be at least as wide as a single thumbnail and should include a few extra pxiels for borders, padding, etc.
This page last changed on 26 Apr 2013.