Embedding SimpleViewer 1.9 in a HTML Page:

This document applies to SimpleViewer version 1.9. SimpleViewer has been upgraded to version 2.3.0. View upgrade information.

To embed SimpleViewer (or SimpleViewer-Pro) into an existing HTML page do the following:

1. Create your SimpleViewer gallery as normal (check instructions here).
2. Copy the entire contents of your SimpleViewer gallery folder into the folder that contains your HTML page (including the swfobject.js file and sub-folders).
3. Edit your HTML document using a HTML or text editor. Copy and paste this code block where you want SimpleViewer to appear:

   <script type="text/javascript" src="swfobject.js"></script>
   <div id="flashcontent">SimpleViewer requires JavaScript and the Flash Player. 
   <a href="http://www.macromedia.com/go/getflashplayer/">Get Flash.</a></div>
   <script type="text/javascript">
   var fo = new SWFObject("viewer.swf", "viewer", "800", "600", "8", "#181818");
   fo.write("flashcontent");	
   </script>

4. Upload the entire folder contents to your webserver.
5. To view your gallery, navigate to the gallery folder in your browser.

Setting Gallery Size and Background Color

To set the gallery size and background color, edit this line from step 3 above:

var fo = new SWFObject("viewer.swf", "viewer", "800", "600", "8", "#181818");

• Change the "800" to be the width of your gallery. It can be a pixel value ("800") or a percentage ("50%").
• Change the "600" to be the height of your gallery. It can be a pixel value ("600") or a percentage ("50%").
• Change the "#181818" to be the hexadecimal background color of your gallery.

Note for Dreamweaver Users:

To make SimpleViewer work you need to use the embed method described above. Using Dreamweaver's Insert -> Media -> SWF method will cause SimpleViewer to break. This is because SimpleViewer uses SWFObject to embed the SWF. SWFObject is an industry standard way to embed flash content that handles Flash player detection and upgrade prompts. Using the default Flash embed method in Dreamweaver will not work, since the config options that are set in the Javascript will be ignored.

Example

Do a 'View Source' on this page to see this working example.