Converting a Flash Album Generator 1 gallery

Open the HTML file that you've made with Flash Album Generator version 1.

You can start the conversion by clicking on the Commands menu in Dreamweaver and choosing the Convert Flash Album 1 to 2 option.

A new popup appears;

Press the Convert button.

Another popup appears;

Please check the final results carefully and make adjustments when necessary using the property inspector.

That's it you've converted your album!

Creating a new album

Before you start, define your site in Dreamweaver. This page shows you how to define your site. Start the extension by clicking on the Commands menu in Dreamweaver and choosing the Flash Album Generator 2 option. Or by pressing the  icon in the object pallet in the Common bar.

A new dialog will appear, we'll start by filling in the Creation Options.

First we'll fill in the title. Then we select the Source Images Folder (the folder with the photo's you want to use for your photo album) and then we'll select the Destination Folder where the gallery resides. It is wise to create a separate folder for your album.

Now we just have to fill in the Thumbnail Format and Photo Format to determine the quality vs. image size options for the thumbnails and photo's. Thumb Dimension sets the size that your Thumbnails will be resized to.

The Resize to fit option enables you to resize the images of your album to the specified size
(width x height). With the Show filenames option you can enable or disable the display of the filenames of your selected photo.

Let's fill in the Thumbnail Options, first we'll select the number of rows and columns that we want to use to display the thumbnails. In this example we display five thumbs next to each other in two rows.

Padding sets the distance between the Thumbnails in pixels, we'll set it at 10.

Now let's define the last fields in the Visualization Options.

The Image Scale defines the maximum relative size of the image in relation to total stage size.

If you set the Image Scale to 70% and you have two rows of five thumbnails you will get the following layout;

If you set the Image Scale to 70% and you have five rows and two columns for your thumbnails you will get the following layout;

Note: The thumbnails will be displayed in the available space. If your thumbnails are cropped to much, like in the example below, you can lower the number of columns (or in other cases the number of rows).

Lets select the position of the navigation (a list of clickable thumbnails) and the Navigation direction (for the option left to right, the first thumbnail is positioned on the left side).

After that you can change the Background Color, Text Color and Frame color, the default Background Color is white, the default Text Color is black and the default Frame Color is white.

Now you can enter the Frame Width to determine the size of the frame (border) around the full version of the selected photo. The Active Frame Width sets the size of the frame (border) around the selected thumbnail.

Finally we'll select the transition we like to display when a new photo is selected and the Transition duration.

Press OK to generate your album.

Fireworks, will start automatically to resize your images. In the status (batch) window you'll see the total number of images that have been resized, the total number of images that need to be resized and the image name.

After Fireworks has finished the batch process, Dreamweaver will give you the following notice;

Be sure to copy the dmxFlashGallery2.swf, your XML file and the photo folder to your server.

Press OK and press f12 to preview and save.  That's it you've created your own photo album!

Note: If your site is on a remote host, you have to upload the HTM, SWF, XML files and the folder with the photos to your server.

Below is an example;