How to build pages like these using PhotoStory

Virender Singh Dogra

Date: October 8, 2003

Table of Contents

What it does
Step By Step
What this tool needs
Limitations
Changing the output?

This document explains how using PhotoStory you can build photostory web pages almost automatically.

What it does

This tool helps you build a web story from your digital photographs.

  • Generates the tabs so your viewers can navigate between different groups you have set up.

  • Generates the main index page with the thumbnails and the title and captions alongside. Advanced users can modify the settings.xml page to get the size and quality thumbnails you want.

  • Generates the picture pages where the big size main images and the stories are also shown. Advanced users can modify the setting.xml page to get the size and quality full pictures you want.

  • Facilitates sending of comments to a given email address with reference to any photograph.

  • It generates the required thumbnails for the index page for different sections/tabs of the project. Tests ok in Mozilla and Internet Explorer.

  • It can generate ftp scripts for you to automate your task of uploading the files to your web server. You just have to execute the respective "bat" files in the output folder.

  • Inserts additional text you may want to insert into your templates.

  • You can change the templates/design/layout or make new ones as per your taste.

In the templates folder there are several sample templates for your use. Or you use them as a guide to make your own.

Step By Step

  1. You collect and arrange your photographs into groups, putting each group in a separate folder.

  2. Use pixvue (see tools below) to enter titles and captions that go with your pictures.

  3. Choose a template that you like from the "template" folder. "JPG" files are included to show you what your output will look like. The included myPhotoStorySettings.xml shows you how "Susan's Indian Adventure" was built.

  4. Modify myPhotoStorySettings.xml with your choices and settings for your site.

  5. Use your browser to check your myPhotoStorySettings.xml by opening it in your web browser(maybe by dropping it in the browser). A backup is always automatically saved in the folder "backup".

  6. Run PhotoStory - Start runPhotoStory.bat. This script allows you to run locally and preview the results before you are ready for publishing in the next step.

  7. Publish!! - Use your file transfer program or the upload scripts generated by Photostory to publish your story. In the "output" folder you will find upload scripts. The first time you will probably want to run UploadAll.bat.

What this tool needs

  • You need to use a tool like pixvue (freeware) which lets you annotate a "JPG" image file using IPTC/XMP format (XML format), to add your story to an image file. Refer to the instructions on how to do that on that site.

  • Add your "Title" and "Caption" to the "JPG" image files you want to build story pages off of

  • Edit the myPhotoStorySettings.xml file and change it to specify the title, menu names, input directory, thumbnail size, etc

  • Now the photoStory application can generate PhotoStory pages automatically for you.

  • Also it will create upload scripts using ftp for automatic upload ;-) Read on...

  • You need to have java on your machine. If you can find a file called java.exe you should be fine, or else install the jre from the sun site.

  • Tested on a Windows 2000 PC with JDK 1.4 - java

  • Download the latest version and unzip it onto your hard drive in a new folder/directory called "photostory".

  • Run the runPhotoStory.bat

Limitations

  • Only works with "jpeg" images as of now

  • Only works if the comments are in IPTC/XMP format, which is what pixvue creates.

  • It's a bother to work with the long winded format of an XML file. Need to build a graphical interface for the users to deal with it. On my priority list.

Changing the output?

  • Want to change the name of the main file being generated ?

    Edit myPhotoStorySettings.xml and change the value for "mainpage"

  • Want to change the email address for the comments?

    Edit myPhotoStorySettings.xml and change the value for "emailResponse"

  • Do not want a link for sending comments?

    Edit myPhotoStorySettings.xml and delete the complete line for "emailResponse"

  • Want to change the Heading of the main file being generated ?

    Edit myPhotoStorySettings.xml and change the "title" in the section or for the overall site itself

  • Want to generate images of a different size/quality than the default value ?

    Edit myPhotoStorySettings.xml and change the size/quality parameter as desired. The higher the quality value the bigger(in terms of KB's) the generated image files will be

  • Want to change the look of the html pages ?

    Take a look at the template directory and change or create a new template from the existing ones. Then specify them in the myPhotoStorySettings.xml file also.

  • Want to test all the tabs/menus locally ?

    Generate using a "single server" setting instead of "multiple server"

  • What is the FTP thingy ?

    If you specify the ftp: site/username/password it will generate the ftp script for a automatic upload to your ftp site when you execute those "bat" files in the "output" directory.

  • How do i upload images which are global like banner images and other images I want to use in my templates?

    Copy those images to the "template/globalImages" directory and your wish will be granted. And be sure to specify them in the template that you use so that they show up on the page too ;-)

  • How do insert additional text into my pages?

    First, create the ".txt" file with the text you want put it in the directory "text". Then include the file in your template file by adding the following where you want the text to appear.

          #include( "text/myText.txt" )

- Viru ( )