Web Photo Gallery

Web Photo Gallery is a surprisingly deep feature. It creates a home page with thumbnail images and a gallery page for each image, or a frame-based page that combines scrolling thumbnails with a single larger gallery image. Some of the styles offer a feedback option where visitors to the page can check Approved or Other, or email feedback. Figure 9-18 shows the different sections of the Web Photo Gallery dialog box.

Figure 9-18. Web Photo Gallery

General settings

Banner settings

Large image settings

Thumbnails settings

Custom colors settings

Security settings

The Site section lets you choose a style for the gallery from the Style menu (the appearance of each style is reflected in the thumbnail that appears below the main control buttons) and enter an email address for receiving feedback.

The Source Images section lets you choose a folder or Selected Images from File Browser as source. It's also, somewhat confusingly, where you specify the destination folder.

All the styles produce the following:

• An index file

• A photos.js JavaScript

• An Images folder that contains the large images and the graphic page elements

• A Pages folder that contains an .htm or .html file for each image

• A Thumbnails folder that contains the thumbnail JPEGs

• A UserSelections.txt file

The files and folders produced by Web Photo Gallery always have these names, so the only way to differentiate between different galleries is by the enclosing folder name. Hence it's always a good idea to create a new, empty folder and use it as the destination.

The remainder of the dialog box is devoted to the Options panels, of which there are six.

• The General options let you choose between an .htm or .html extension, use UTF 8 encoding (a Unicode encoding that offers backward compatibility with ASCII-based systems) for the URL, include width and height attributes for the images to speed downloading, and choose the option to preserve or strip all the metadata. (If you only want to strip some metadata, you'll need to edit it using the techniques discussed in Chapter 8, Mastering Metadata, before running the automation.)

• The Banner options let you enter a site name, Photographer, contact info, and date. These entries appear in the banner on each page.

• The Large Images options let you set the pixel size of the images and the amount of JPEG compression, apply a border, and use selected metadata for titlesthe available options vary depending on which style you've selected.

• The Thumbnails options let you choose the thumbnail size and, in some styles, layout, apply a border, and use selected metadata for titles. As with the Large Image options, the available options vary from style to style.

• The Custom Colors options let you choose colors for the background, banner, text, links, active links, and visited links. Again, the available options vary from style to style.

• The Security options let you place text on the images to prevent people from stealing them. You can choose from various metadata selections or enter custom text, with control over the font, size, opacity, position in the image, and rotation.

Not only do the options that are actually available vary depending on the style chosen, sometimes options that seem to be available don't actually do anything. Pages created with Web Photo Gallery probably won't win any design awards, but the feature does provide an easy way to make simple web galleries. Figure 9-19 shows the thumbnail page and an image page created using the settings shown in Figure 9-18.

Figure 9-18. Web Photo Gallery result

The index page

An image page

If the preset layouts don't do what you need, you can create custom layouts using the presets as templates. You'll need to be comfortable editing HTML, which I confess I am not. But if you are, you'll find a folder corresponding to each of the preset styles in Applications/Adobe Photoshop CS/Presets/Web Photo Gallery (Mac) or Program Files\Adobe\Photoshop CS\Presets\Web Photo Gallery (Windows). Inside each folder you'll find five .htm files.

• Caption.htm determines the layout of the captions that appear below the thumbnails on the home page.

• FrameSet.htm dictates the layout of the frame set for displaying pages.

• IndexPage.htm dictates the layout of the home page.

• SubPage.htm determines the layout of the gallery pages.

• Thumbnail.htm dictates the layout of the thumbnails that appear on the home page.

None of these filenames can be changed, so if you want to edit an existing style, duplicate the entire folder of the style you want to edit and work on the files in the duplicate folder. When you're done, rename the duplicate folder to the style name you want.