PI6 Web Slide Show

 

Slide shows can be a wonderful way to display wedding photos, pictures of a new grandchild or a special photo collection. One of the nice new features in PI6 is the ability to create slide shows that you can upload to your own server for an online slide show, or send as an email attachment to someone you know. (View Slide Show)

This tutorial will show you how to do both with the slide show. If you've ever used Album or PhotoExplorer to create a slide show, you will find the process remarkably similar. Use your own images, or you can use this ZIP file with 5 photos of mine that I'll be using to illustrate the process. The images do not all have to be the same size, but it makes for a smoother presentation if they are.

Start off by making yourself a new folder on your hard drive and calling it slideshow or something else that you'll remember. Unzip the photos to this folder, if you're using mine.

Choose File, Export, Web Slide Show. You'll get this Select Image dialog box.

Select Images for Slide Show

Hit the Browse button and navigate to the folder to which you saved the images. To make it easier, I selected only .JPG images from the Type dropdown list. Click OK.

When the Export to Web Slide Show box opens, you'll be at the Output tab by default. For the Output folder, click the Browse button and find the slideshow folder you found. Note that the file name, main.htm, has already been filled in. Choose whether to save the slide show as a web page, or as a self-extracting .EXE file.

Output tab

Click the Page Setup tab next.

Page Setup tab

Give the slide show a name to be seen in the viewer's browser. By default, a header and footer will appear during the slide show. Change the default text to your own text, or deselect header or footer if you don't want them to appear.  To use something other than the default font, font size and color, click Format for Heading and Footer to open the Text Format dialog box.

Text Format box

From here you may format the text for the header and footer. I chose the values shown above. The default font size of 4 is just a bit too large, in my opinion, so I took the font size down to 2 and changes to navy blue text. Click OK and return to the Page Setup tab. Select a method for linking pages with images.

Click the Advanced button to open the Advanced Page Settings dialog box.

Advanced Page Settings box

Edit the page background color if you wish, or select an image file for the background. Change the text and link colors to suit your needs. Selected colors will appear in the Sample preview window. Don't forget to Browse for a music file for your slide show. The HTML for embedding a music file will be placed in the slide show page automatically.

Finally, click on the Slide tab.

Slide tab

You'll see that "Limit image viewing size" is selected by default and limited to 800 X 600 pixels. Deselect this option and also deselect "Resize image." If you don't, your images will be stretched to fit the entire browser screen and are likely to be extremely distorted. Under "Image file format options," select a JPG compression level. I'm setting mine to 100% to obtain optimal image quality. If the images were not so small, however, I would probably have selected a compression level of 75-85%. Under "Time settings" I've selected the "Automatically advance to next page" option, with a Delay time of 5 seconds. If this option is deselected, viewers must click on links to go forward or backward in the slide show.

Now that all of the attributes of the slide show have been specified, click OK. PI will whirl briefly while is saves the slide show. Your browser should open automatically, and the slide show will be displayed. Close your browser when you're done previewing the slide show. 

Before you upload to your server, take a moment to go into Windows Explorer to examine the slide show's file structure.

Windows Explorer view of files

Note that the file main.html is the framed page that loads the slide show. The five images will appear on the main1.html, main2.html, main3.html, main4.html and main5.html pages, respectively. A copy of the music file has been placed in the same directory with the HTML pages, and an HTML page called bgSound.html was created to play the music. In addition, you'll see that an Images folder was created automatically. If you click on the folder, you'll find the five JPG images for the slide show in there.

What this means for you, as the webmaster, is that you must be very careful about uploading the slide show files into the correct directory on your server.  Be sure that you upload all of the HTML pages and the music file to the main directory, and that you upload all of the images to an images directory. If you don't have an images directory, make one and upload the images to it.

If you want to send a slide show to someone as an .EXE email attachment, follow the exact same steps for creating the slide show. The only difference will be on the Output tab, where you will select "Save pages in self-extracting .EXE file," rather than saving it as a web page. To send the slide show as an email attachment after creating it, select "Send .EXE file as email attachment when finished." 

When you click OK to create the slide show, the .EXE file will be saved to the specified folder and your email client's New Message window will open. The .EXE file will automatically appear as an attachment called "UleadWeb.EXE." My slide show weighs in at 176 kb, which isn't small but it isn't too hefty either. Type in your own email address to test the slide show. If you're online, you can hit Send to send the email with the attachment, or you can choose to send it later.

Finally, a few words of caution about sending .EXE files. Many people are justifiably worried about getting computer viruses via email attachments. If you want to send an .EXE slide show to someone, be sure to email them before you send it to alert them to the attachment that you'll be sending.

This tutorial uploaded 10/27/00

Do not duplicate, translate, copy, archive, appropriate or redistribute this document.

 

 

Contact
Back to Homepage