Your download includes everything you need to create a stand-alone flash gallery or a gallery to add to your html pages. You do not need the Flash Authoring application.
Size your images to the maximum size that you want them to appear in the gallery. You don’t need to create thumbnails. Save your images in JPG format into any folder within the same directory as the gallery. Make sure the JPG’s are saved as non-progressive JPG’s. To create more albums, simply create another folder, and fill it with images.
Now upload the following files to your server: flashGallery.html, flashGallery.php, flashGallery.swf, setup.xml, flashdetect.js, and the image folders. Load flashGallery.html in the browser, and you should see your gallery. That’s it!
To make updates, you only need to upload the images and image folders. The gallery will pick them up automatically.
The flash gallery allows you to create simple html text pages. This option can be used to create about, contact, or other information pages, allowing you to turn this gallery into a full flash site.
Create a text document and save it with a .txt extension in it’s own folder. The name of the folder will become the menu item, so if you call the folder “About Us” that will be the name that appears in the menu.
When creating your text, you can use simple html 1.0 for formatting. You can use the following tags: <a>, <b>, <p>, <i>, <u>
Once you have finished editing the text, upload the folder and it’s contents to the server. Remember, you will not be able to preview you gallery on your local computer.
Server that supports php. (Most paid and free servers support php.)
1. Create a new document with notepad or any html editor and save it as php_into.php
2. in the body of the file type the following 3 lines of code:
3. Save the document and upload it to your server. When you load it into a browser window, you should get a long list of php specifications. If all you see is the three lines above, your server doesn’t support php. You will have to contact your host and arrange for php to be activated.
Open setup.xml using a text or html editor. Avoid using word processing software. This is a simple text file used to customize the way the gallery looks. The structure looks like this:
Each name/value pair represents a setting in the gallery. The following is a table of descriptions and sample values.
|Attribute with sample value||Description|
|bg_color="333333"||Background color of the gallery|
||Opacity of backgrond|
|bg_image="images/bg.jpg"||Image to be used as background. Omit attribute to use color.|
|bgImageSizing="stretch"||"stretch" – stretches the image to fill the background.
"fill" – fills the background with the image without distroting it.
|scrollbar_color="666666"||Scroll bar color|
|scrollbar_arrows_color="FFFFFF"||Scroll bar arrows color|
|show_shadow="true"||Set to true to display shadow on main image. Set to false to hide shadow|
|thumb_show_shadow="false"||Set to true to display shadow on thumbnails. Set to false to hide shadows|
|shadow_scale="50"||Size of shadow. Play around to get a feel for it.|
|shadow_alpha="30"||Shadow transparency of main image|
|text_color="999999"||Color of captions|
|text_size="11"||Size of captions|
|menu_text_color="ff7f00"||Color of menu text|
|menu_text_size="10"||Size of menu text|
|menu_bg_color="434343"||Menu background color|
|menu_rollover_color="FFFFFF"||Background color of menu roll over state|
||Width of menu|
|menuTabWidth="50"||Width of menu tab, which is visible when menu is collapsed|
|menuTabHeight="20"||Height of menu tab, which is visible when menu is collapsed|
|menuCornerRadius="5"||Roundness in pixels of the corners of the menu. Set to "0" to create sharp corners.|
|menuX="3"||Horizontal position of the menu.|
|main_image_border_color="7b7b7b"||Color of main image border|
|main_image_border_size="10"||Width of main image border|
|main_image_hailine_border_color="7b7b7b"||In addition to the main border, there is a thin border that separates the shadow from the main border. Usually set to a slightly darker of the main border looks good.|
|thumbs_border_color="FFFFFF"||Color of thumbnail borders|
|thumbs_rollover_color="ff7f00"||Color of thumbnail roll over border|
|thumbs_active_color="FF0000"||Color of the box around active thumbnail|
|thumbs_bg_color="434343"||Thumbnail background color.|
|thumbs_pane_bg_color="434343"||Color of background behind thumbnails|
|thumbs_pane_bg_opacity="20"||Opacity of background behind thumbnails|
|menu_text="menu"||Text that appears on the menu tab. Something like "menu" or "nav" works good.|
|headline_text="YOUR TEXT HERE"||Text that appears in upper right.|
|headline_text_size="20"||Size of text in upper right|
|headline_text_color="ff7f00"||Color of text in upper right|
|load_external="false"||Set to true if loading an external logo to replace the headline text|
|external_logo="external_logo.swf"||Location of external logo. This can be a JPG or SWF. To add your own logo you will need to create your logo as either a jpg or an swf and save it in the same directory as flashGallery.swf. You will need to set load_external to "true" above.|
Number of characters to remove from beginning of folder titles. This allows you to order the albums, independent of actual folder title. For example, if you set this number to "2", the first 2 characters will be removed from the titles of the folders, so if you name your folders:
||Number of characters to be removed from the beginning of the image titles. Used to give images a specific order independent of their titles.|
||Specifies the first folder to display once the gallery loads. Set to a number which representing the order in which the album appears in the menu, starting with 0.|
||Set to "true" to display menu folders in reverse order.|
|reverseImageOrder="false"||Set to "true" to display images in reverse order.|
||Size of scrollbar. Will effect both height and width of scrollbar and scrollbar buttons|
||Width of the arrow graphic within scrollbar buttons|
||Height of the arrow graphic within scrollbar buttons|
|click_screen_navigate="true"||Set to "false" to disable clicking on left or right of screen for navigation.|
|showCaptions="true"||Set to false to hide image titles.|
|showFolderName="false"||Set to true to show the name of the current folder above image|
|folderTextColor="FFFFFF"||Color of folder text above image|
|folderTextSize="14"||Size of folder text above image|
|imageMargin="10"||Margin around the enlarged image|
|music="music.mp3"||Path to .mp3 music file to be used as background sound. Omit attribute if no sound is desired.|
|musicVolume="100"||Volume of the background sound.|
|loopMusic="true"||Set to true to loop the background sound. Set to false to only play backgroudn sound once.|
|stage_scaleMode="noScale"new||Sets Stage.scaleMode for the gallery. Should only be changed if loading the gallery into another flash project. See Adobe documentation for values.|
|stage_align="TL"new||Sets Stage.align for the gallery. Should only be changed if loading the gallery into another flash project. See Adobe documentation for values.|
|slideshowMode="false"new||Set to true to activate slideshow mode. Gallery will rotate the images until a user clicks on one of the thumbnails or selects another item from the menu.|
|slideshowSpeed="4"new||Time for each image to remain on stage in seconds before switching.|
|hideMenu="true"new||Set to false to keep the menu visible at all times.|
|menuY="0"new||Vertical position of the menu in the down position.|
|menuFont="Verdana"new||Font face of menu nav items.|
|menuTabFont="Verdana"new||Font face of text in the menu tab (menu).|
|folderTitleFont="Verdana"new||Font face of text above large image.|
|captionsFont="Verdana"new||Font face of captions.|
|headlineFont="Verdana"new||Font face of text in upper right.|
|thumbsYoffset="0"new||Vertical position of thumbnail strip from the bottom .|
|imageLinked="false"new||Set to true to make large image linked to the original image. Opens in new window.|
Play around with the above settings to achieve the desired style for your gallery.
The auto flash gallery allows you to specify folders or files that you want to exclude from the gallery. This is useful if your server automatically creates certain folders or if you are using FrontPage. To specify files that you want to exclude open flashGallery.php in an html or a plain text editor. At the very top you will see this piece of code:
$exclude_files = array(
This is an array that lists all the file or folder names to be excluded. There are already some common folder names here. To add to the list, place a comma after "_vti_txt" and add the folder or image name in quotes.
If you want the albums to appear in an order other than alpha-numeric, take the following steps.
Step 1 – Open setup.xml and find the following line: omit_folder_chars="0". Change it to omit_folder_chars="2" This will remove two characters from the beginning of the album titles in the menu.
Step 2 - Rename your folders starting with a number. For example:
These will appear in the menu as:
You can do the same for images by specifying a value for omit_file_chars="0"
You can create multiple galleries from one swf file by passing variables to the gallery, which tell it where to look for content. The flash gallery accepts the following variables:
setupfile – path to the xml file (setup.xml)
scriptpath – path to gallery script (flashGallery.php)
gallerypath – path to the main directory where image folders are located
By default, the gallery will load the files that are included in the download from the same directory. To change any of these parameters, you will need to pass them to the SWFObject in the html of flashGallery.html like so:
<div id="flashcontent">Contents will be replaced with flash</div>
var so = new SWFObject("flashGallery.swf", "gallery", "100%", "100%", "6", "#FFFFFF");