left round   right round
Photogallery Logo sharing gif
spacer

Home

Earth

Water

Sky

Plants

Animals

Places

 

Other Shots

Newest Galleries

02-07-04
02-08-04
02-25-04

Digicamhelp Link - The digital camera guide for beginners.

The Digital Camera Guide for Beginners

 

Valid HTML 4.01!

Photogallery Tutorial

 


It’s time to create some pages. Create a page to use for the large images. I try to keep this very simple and use a table with a layout having two rows. I have the top row consisting of three cells to contain the slide show navigation and the second being a single cell to hold the image.
 

Previous Image Close This Window Next Image
 

Large Image

 

To set up the navigation place your cursor in the left cell, click on “Code” view and insert the following js snippet,

<a href="javascript:history.back(1)">Previous Image</a>

To create the “Close This Window” link do the same but in the middle cell with the following js snippet,

<a href="javascript:window.close();">Close This Window</a>

The “Next Image” link is simply a link to open the next image page in the series,

<a href="nextimage.htm">Next Image</a>

Obviously this is subject to what information you may want to include on the page. For example, you may want a third row to provide some information about the image but remember not to make the page too long or it will result in scrolling of the popup.
Create a folder for the specific gallery pages and save this page as “large_template”.
Now that you’ve saved a blank copy of the template open the large image folder and drag the first image into the container cell. Right click on the image and add your “Alt Text”, a brief description of the image. For the first page of the series remove the “Previous Image” link, it can’t go “back” anywhere. Save this page using the image name (first_image.htm) and close it. Open the “large_template” page and insert the next image in the series, don’t forget your “Alt Text”, and save it. Now that you’re into the series simply delete the image and drag the next one in, add “Alt Text” and save (as image name). Continue with this process until the series is complete. For the last page of the series delete the “Next Image” link, it doesn’t have a place to go.
One last step needs to be done for the image pages. Open each in turn and create the link to the next page in the series. This had to be last since the pages weren’t created yet.

Top


 

 
Photogallery Tutorial
Page 1
Page 2
Page 3
Page 4
PDF Version
10x120 spacer
Photogallery - copyright 2003-2004
spacer