Friday, January 2, 2009

Flash and library websites

Many libraries are looking for quick and easy ways to jazz up their websites. One way to do that is by incorporating flash technology onto the site. Unfortunately, Flash has gotten a reputation for being difficult to integrate. Fear not, there are easy ways to incorporate flash into your website.

One of the easiest ways is to use a flash slideshow to rotate through jpeg images. These can be photos of your library, program information, or any other kind of promotion you wish to run.

One of the easiest flash slideshows I have found is JW Image Rotator (http://www.longtailvideo.com/players/jw-image-rotator/). It's free, and easily configurable.

The JW Image Rotator enables you to display photos in sequence with fluid transitions. It supports rotation of an RSS, XSPF or ASX playlists with JPG, GIF and PNG images, a wide range of flashvars (variables) for tweaking both behavior and appearance and an extensive javascript API.

First, download the software.

Put the src file in whichever directory you choose on your website, then reference it in the webpage which will hold the slideshow:


<script type="text/javascript" src="swfobject.js"></script>



Next, enter the appropriate code into the page to load the player and display:


<p id="player2"><a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this player.</p>
<script type="text/javascript">
var s2 = new SWFObject("imagerotator.swf","rotator","400","300","7");
s2.addVariable("file","images.xml");
s2.addVariable("transition","fade");
s2.addVariable("shownavigation","false");
s2.addVariable("overstretch","true");
s2.addVariable("width","400");
s2.addVariable("height","300");
s2.addVariable("rotatetime","7");
s2.write("player2");
</script>



Edit the file variable to set the path to your file (in this case, called images.xml), and make sure the height and width are correct.
The images file is simply an xml style file formatted playlist as such:


<?xml version="1.0" encoding="utf-8"?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">

<trackList>

<track>
<location>/images/picture1.jpg</location>
</track>

<track>
<location>/images/picture2.jpg</location>
</track>

</trackList>

</playlist>


You now have a flash slideshow for your homepage!

No comments: