Readers have been asking me me how to edit the Flash web galleries that come out of Photoshop’s Web Photo Gallery feature. It takes some coding, but it’s pretty easy to do if you know where to look and it doesn’t require the Flash application.
Back in November I wrote an article on Photoshop CS2’s ability to generate Flash-based web photo galleries, and how it gives anyone the ability to add the “rich media experience” of Flash to simple photo galleries online. It was a hit among readers but the question that kept coming up was, how do you customize these galleries? See below:
These are hard questions because Photoshop does not offer us a native Flash (.fla) file to edit, but a Flash movie file (.swf) that is uneditable by conventional methods. Photoshop’s Web Photo Gallery feature is not designed to give us the editing capability of the true Flash application. However, there is quite a bit of customization you can do to your Flash web galleries, and the key is in editing the XML files that come with the gallery.
Along with the “gallery.swf” file, which is the Flash movie, Photoshop generates several other files:
How these files work together to create the web gallery is beyond the scope of this article, suffice it to say it involves a lot of advanced web programming and development. What we’re interested in are those XML files, because they make the data that drive the web gallery accessible and editable.
XML is raw data with markup, editable by any text editor or web design layout application such as Dreamweaver. “galleryconfig.xml” controls aspects of the web gallery such as image size, the thumbnail navigation, controls and audio. It is commented, which means the author wrote in some helpful comments to help us understand what the code does. Here is a snippet (commenting and open/close tags removed):
IMAGE DISPLAY
width and height (in pixels) of border around main image
var symboltype=”number” name=”bordersize” value=”16″
color (in hex) of the main image preloader
var symboltype=”string” name=”imagePreloadColor” value=”000000″
Change the value of the variables, and the SWF file will respond accordingly.
“photos.xml” controls several other aspects of the web gallery, including color for background, text, links and more. There’s even empty tags for photographer, contact information and e-mail (lines 11–13) that you can fill in and they will display in the SWF file. If you don’t know anything about coding, all it takes to fill in these tags is to type in the data between the tags.
The XML files allow for customization of several aspects of the SWF file, but you are limited by the makeup of the SWF file itself. The SWF file is only looking for specific XML data such as image source, width, height, photographer and more, and if you were to edit the XML file so a new XML tag (descriptive text, for example) the SWF file would not be looking for it so it’s a lost cause. The SWF file, like all Flash movies, is protected from editing even in Flash so you are stuck with its composition. If you are looking for more customization than the XML files can offer you, then it would be best to create your own Flash web gallery and control it from a native file. Or you may find some software out there designed to crack into SWF files. Or maybe in a future version of Photoshop the Web Photo Gallery feature would generate not only a SWF file but a native Flash file as well. Now that Adobe and Macromedia are one, the possibility of this is much greater.


There is a way to edit the fla file for the web galleries discussed in this article. Not many people know that the source files are located at Adobe.com. They have also bundled a third web gallery on their site as well.
Is there a way to load the swf into another flash movie? I’ve been trying to do just that, and can’t figure out what it is that won’t let it find all the necessary files when loading into another movie, even though the gallery works perfectly on it’s own.
You can load a SWF into another Flash movie, but it’s beyond the scope of anything Photoshop can do. It must be done within the movie the gallery is going into, and the ActionScript function
loadMovieis what makes it happen.DESIGNORATI
when using loadMovie, and if your loading a swf that contains calls to XML files, do you have to do something else in order for it to embed properly? Ive gotten a swf with xml to embed, but it doesn’t work 100% properly.
im wondering how to get rid of the filename display when u rollover on thumbnails in Flash Gallery 1 ??
I downloaded the flash web gallery files from adobe and would like to replace the jpegs with swf files. Can anyone tell me where to put the loadMovieNum or loadMovie comand in the actionscript file of the flash gallery2 (fla file)???
thank you.
I have been using these galleries for a while and love this one in particular.
http://www.puntamita...lestate.com/lapalapa
but i wish I could get rid of the blinding white flash transitions that force your eyes to reset, which is distracting and not helpful. The FLA source let me change the bg color, but no changes in the output.
Small gripe.
I’ve been trying Slideshow Pro
http://www.lapuntare...m/haciendalossantos/
but some people with older versions of Flash can’t see it. Hrmf!!
The new PS3 galleries I have seen aren’t minimalist like I need them to be.
Hopefully there is some gold out there for auto batch minimalist, unbranded, elegant, progressive loading flash slide galleries via Photoshop file browser.
I just experimented withthe banana skins in JAlbum 7.0 and will have my fingers crossed.
So far, very good.
hi!
does anyone know what i can do if i don’t want the background to be of any color but of the picture i use as a background in my website?
thanks in advance
Change the wmode parameter in the flash player html for transparent backgrounds:
I got the source files from adobe but Flash is not bringing up the thumbnails in the gallery. Any suggestions?
What code for transparence ?
PS CS3 flash web galleries failure: mostly empty photo frames; rendering landscape and portrait jpegs from Bridge and CS3; large image frame very small. CS2 never exihibited this behavior.
System: Mac w/latest OS X
I haven’t tried CS3’s web gallery tools yet, but I will have to if the reports of bugs and deficiencies are true…
DESIGNORATI
is there a way to align the flash gallery to the left? and not centered?
Yes, you can align a Flash gallery to the left (or top-left), but the nature of Adobe’s Flash galleries can make it problematic.
Here’s how it’s done: look in the index.htm file, at or around line 139 for this:
var myFlashObject = new FlashObject(”gallery.swf”, “gallery”, “100%”, “100%”, 6, “#ffffff”);
This is what controls the width, height and positioning of the Flash movie which controls the gallery. It’s different than regular XHTML, which would control positioning with CSS. The two “100%” attributes control width and height, respectively. If you give either attribute a set value the gallery will snap to the left or top. For example, changing the first attribute to “300″ puts the gallery on the left side of the page. Changing both attributes puts it at the top-left.
Some Flash galleries, however, don’t have static widths or heights and that can cause a problem when the gallery is at the top-left. Some Flash galleries change shape if images have various widths and orientations, and the gallery resizes from the center (not the top-left corner of the Flash movie) so some movies actually resize right off the page. You’ll need to experiment to find the right values for your Flash gallery.
Good luck from one Jeremy to another,
Jeremy
DESIGNORATI
Hey Jeremy,
Please forgive a rookie question but is there a way to edit the html index page generated by my cs3 flash gallery? (see: www.edgewatercottage.net if you are curious) I just want to add a simple gif logo to the top of the page and edit the text fields that are now tagged with
Not sure what the text is you’re talking about (looks like your comment is truncated) but I’d try to edit any text before generating the gallery. As for the image, I think you can do it just by inserting the image code above everything else in the HTML file’s body tag.
DESIGNORATI
I Want to change the ‘bold’ TITLE font at web gallery..I try to make changes into photo.xml & galleryconfig.xml but nothing happened can anyone help me?? thnx in advance!
nobody? plz help me guys… i must get down with this !!!
last time i try to create that in shilafc.com but hav problum bro…how