General • Download • HTML Generation • Customization • Examples

example screenshot

General

SimpleViewer is a free flash application by Airtight Interactive. It can be used as stand-alone product to show your images on a website. The SimpleViewer XML template offers a convenient way to use BreezeBrowser for generating the images and the XML file that controls the gallery. Since BreezeBrowser was made for photographers it offer professional resize, sharpen and watermark features.

Airtight Interactive's Terms Of Use
SimpleViewer may be used in any kinds of personal and/or commercial projects. It may not be redistributed or resold to other companies or third parties.

The same terms apply to the SimpleViewer template by EOS4you. It is also free of charge. It can be used with BreezeBrowser (version 2.8 or higher) or BreezeBrowser Pro.

Version History:

Oct. 17th 2006 - Fix for Firefox browser.
Sep. 20th 2006 - Upgraded to SimpleViewer v1.8, header part added and better Flash detection script.
Jan. 16th 2006 - Also works with non JPG images, no XML file used and better Flash detection script.
Jan. 8th 2006 - First version released.


Download and Install the Template

First you have to download the SimpleViewer template, then extract the ZIP file and copy the folder "SimpleViewer" into your default template directory (which is usually located at C:\Program Files\BreezeSys\BreezeBrowser\templates).

Before you start generating a gallery it is important to set some of the HTML preferences to a fixed value:

  • Check Convert filesnames to lowercase.
  • Leave the Prefix and Suffix fields empty so that the original filenames are used for the main and thumbnail images.
  • Set the Directory for the main images to images.
  • Set the Directory for the thumbnail images to thumbs.


HTML generation tips

You should be familiar with BreezeBrowser's HTML generation feature. If not, please read the online help pages first.

If you have installed the template correctly the drop down box "HTML template" will contain the entry "SimpleViewer". See the screenshot below:



The maximum size of the thumbnails is important because SimpleViewer v1.8 will resize them automatically to fit in the squares. With 98x98 the thumbnails are untouched which results in a better image quality.

At the bottom of the HTML Page Generation window you can set the image caption and the frame color. The latter will also be used for the caption text.

Now click "Generate HTML" and the SimpleViewer gallery will show up in your default browser.


Customization

There are two files available for customization. Both are located in the SimpleViewer template folder. The first one is index_template.html. Open it in a text editor (e.g. notepad) if you want to change the background color. The line of code is:

background_color = "#777777"

The gallery title and background color can be changed there as well. See the inline comments in this file. To completely suppress the header part delete this line of code:

<h1>@title@</h1>

The second file for customization is index2_template.html. It contains a bunch of SimpleViewer variables which are explained on the SimpleViewer website. Here you can change the thumbnail grid and position, the frame size, and much more. The values for text and frame color are set via the HTML dialog but you can override them here.

Note that the fullsize_template.html file is emtpy on purpose.

For changes that should affect only one gallery you can also edit the files in the output folder instead of the template folder. Just be careful because a regeneration will destroy your changes.

For more information please read the SimpleViewer FAQ.


Examples

All example galleries show the same 25 photos of the Eiffel Tower in Paris.

click for example... View example 1 in a new window.

The first gallery shows the images on a light grey background with the navigation to the right. When you move the mouse over the thumbnails the image ID (filename without extension) appears below.



click for example... View example 2 in a new window.

The second gallery shows a black background with the thumbnails on the left side. Below them there is a copyright notice with a clickable link to the photographer's homepage. This can also be used as a "back" link.



click for example... View example 3 in a new window.

The third gallery has a white background and three rows of thumbnail images to the right. Resize the window with your mouse and see how the main image gets resized when window gets smaller! This is done by SimpleViewer and may degrade the image quality. On the other side it's possible to show large images on bigger screens without excluding people with smaller screens from viewing your photos.



click for inline example... It's also possible to show a SimpleViewer gallery within an existing web page. Read more...







Top