What about saving time for installation? Try the WS-Slideshow Configurator for free, which configures the WS-Slideshow as quick as possible!

1. Download the WS-Slideshow and unzip it.

2. Use the code of "template.html" located in folder named "deploy" as a template for the needed HTML code. Copy and place all the code of the div
<div id="flashcontent" >...</div>
into your page. For embedding the WS-Slideshow the template uses a JavaScript called SWFObject, which has to be linked too. The best way is to place the following code into the head of the HTML site:
<script type="text/javascript" src="js/swfobject.js"></script>

3. The SWF of WS-Slideshow is embedded within HTML page using following JavaScript (SWFObject). Important values are commented:
<script type="text/javascript">
// <![CDATA[
var flashvars = {
XMLPath: "slides.xml", // path for xml file
};
var params = {
quality: "best",
allowFullScreen: "true", // fullscreen modus
menu: "false",
bgcolor: "#FFFFFF" // background color
};
var attributes = {
id: "ws-slideshow",
name: "ws-slideshow"
};

swfobject.embedSWF( "ws-slideshow.swf", // path to SWF file of ws-slideshow
"flashcontent", // id of replacing HTML content
"775", // width
"400", // height
"9.0.28", // flash player version
null,
flashvars,
params,
attributes);
// ]]>
</script>
For more information using the SWFObject check out the detailed instructions on its project site.

4. Place all your slides (big images) and thumbs (small images) creating a new a folder within the folder "slides", for example "holiday". The name of any slide and its thumb based on name conventions, for example the thumb of "slide_1.jpg" has to named to "thumb_1.jpg". Note the "1.jpg" at the end of the name!

5. In order to use these slides and thumbs as a new album you have to define a new "album" node within the XML file called "slides.xml". An example:
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<slideshow>
<preferences sec="4" startViewID="1" autoStart="true" hideBar="false" themeColor="0x00C8FA" bgColor="0x000000" />
<albums>
<album slidePath="slides/holiday/" slidePrefix="slide_" thumbPrefix="thumb_">
<description><![CDATA[Album: My holiday]]></description>
<slides>
<slide name="1.jpg" />
<slide name="2.jpg" />
<slide name="4.jpg" />
<slide name="5.jpg" />
<slide name="6.jpg" />
</slides>
</album>
</albums>
</slideshow>


Here are a detailed explanation for the XML structure above:
slidePath="slides/holiday/"
=> The relative path to the slides located in "slides/holiday"

slidePrefix="slide_"
=> A prefix used by all slides (big images) named "slide_"

thumbPrefix="thumb_"
=> A prefix used by all thumbs named "thumb_"

<slide name="1.jpg" />
=> The name of a slide using names conventions mentioned above

6. In order to customize the WS-Slideshow change the attributes declared within the node named "preferences" <preferences sec="4" startViewID="1" autoStart="true" hideBar="false" themeColor="0x00C8FA" bgColor="0x000000" /> For more information check out the PimpIt! section!

7. BTW: You can use any language for all texts (e.g. help texts). For changing language check the PimpIt! section as well.

8. Check out all the other examples files within the downloaded *.zip. You will find helpful comments within all XML files, too.

-Jens
wwww.ws-slideshow.com