Using without Director

Loading thumbnails

If you plan on using thumbnail images in the SlideShowPro Player's navigation (as links, rollover previews, or both), a separate batch of images from your slideshow content is required.

This chapter will cover how thumbnail images for the navigation are created and linked to in the XML document the SlideShowPro Player when not using SlideShowPro Director.

Before we begin...

The instructions here extend the instructions for creating slideshow images, so if you haven't already built a slideshow that loads slideshow content you should do that first before proceeding.

Step one: Create directory

Create a new folder on your desktop named "tn".

Step two: Create thumbnail images

Open each of the original images you used to create slideshow content with in an image editing application (like Photoshop). Modify their size to the dimensions assigned to the SlideShowPro Player's Navigation Link Preview Size parameter (which is 100px square by default). In other words, resize the image by assigning "100" to the longest dimension of your source image. This will give your thumbnail a proportional scale that fits.

Step three: Save images

When done, save the images to the "tn" folder you created in Step one and name the files with the same file name as their counterparts in the "lg" folder used by your album. For example, if you had a large slideshow image at "yoursite.com/slideshow/gallery/album1/lg/image1.jpg", save the full screen version to the "tn" folder on your desktop as "image1.jpg".

Step four: Upload tn folder

When you've finished creating thumbnail versions of each "lg" image, upload the "tn" folder to root of the "album1" directory on your site (so it's alongside "lg"). For example, "http://yoursite.com/slideshow/gallery/album1/tn".

Step five: Edit XML

Download the "images.xml" file from "http://yoursite.com/slideshow/" or remotely edit it through your FTP client. Inside the album element, add a tnpath attribute that points to where the "tn" folder is we uploaded. For example:

<?xml version="1.0" encoding="UTF-8"?>
<gallery>
   <album lgpath="http://yoursite.com/slideshow/gallery/album1/lg/" tnpath="http://yoursite.com/slideshow/gallery/album1/tn/">
      <img src="image1.jpg" />
   </album>
</gallery>

If you'd rather load your thumbnail images using absolute links, you can leave out tnpath and link to them in each img element, like so:

<?xml version="1.0" encoding="UTF-8"?>
<gallery>
   <album>
      <img src="http://yoursite.com/slideshow/gallery/album1/lg/image1.jpg" 
         tn="http://yoursite.com/slideshow/gallery/album1/tn/image1.jpg" />
   </album>
</gallery>

When finished, save the XML file. Remember to upload it to your site if editing locally.

Step six: Publish or load

With the XML file updated, publish a new movie or refresh your web browser. If you see numbers instead of thumbnail images in the navigation, set Navigation Link Style to "Thumbnails".