http://designorati.com

Customizing Photoshop’s Flash Web Galleries
By Jeremy Schultz On 12th June 2006 @ 08:33 In Photoshop, Web Design, Tutorials | 22 Comments
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 [1] 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 [2] Adobe and Macromedia are one, the possibility of this is much greater.
Article printed from Designorati: http://designorati.com
URL to article: http://designorati.com/articles/t1/photoshop/888/customizing-photoshops-flash-web-galleries.php
URLs in this post:
[1] an article on Photoshop CS2’s ability to generate Flash-based web photo galleries: http://designorati.com/photoshop/2005/new-to-cs2-flash-based-web-gallery-layouts
[2] Adobe and Macromedia are one: http://designorati.com/photoshop/2006/what-the-adobe-macromedia-merger-means-for
-photoshop-2/
Click here to print.