TEMPLATES

Where stylesheets control the appearance of the elements of the HTML pages, and the items chosen by the user in ThumbHTML select what is to appear, the idea of the template is to allow control over where this information is placed. Templates come in two forms - 'normal' and 'frameset', with the latter being signified by a 'Frameset_' at the start of the name. The program will automatically ensure that a compatible output style is chosen when you change the template, and vice-versa.

Templates are created for each type of web page produced by ThumbHTML, as shown below:

For the 'normal' template style:

For the 'frameset' template style:
  • index.tmp: the template for the main index page - which defines the frameset
  • top.tmp: the template for the top pages - the title bar
  • left.tmp: the template for the left page - the navigation bar
  • linkedimage.tmp: a template for the linked image page - the 'main' image
  • image_link.tmp: a template for each individual thumbnails with hyperlink

The templates comprise HTML, placeholders (which are replaced with the corresponding picture data by ThumbHTML) and comments to help users to modify them. Five complete sets of templates (see below for details) are provided with the default installation, and to modify these you can either edit them directly - they are stored in a sub-folder called 'templates' of the main ThumbHTML folder - or use the front-end provided by the program for this purpose.
  1. Default
  2. This is the basic set of templates, as shown in detail below

  3. Order_by_Email
  4. These templates meet a specific need - to be able to let users choose images, together with the size and number of copies, and to e-mail a list of these to you. Javascript embedded within the thumbnails template will update an e-mail link on the page with the details of the choices made; when the user clicks on this link, an e-mail window appears, generated by their default mail client, with the details filled into the body of the message. The subject line, and the recipient e-mail address, is provided by the Javascript, so you will need to edit this file to provide your own details (but you only need to do this once!)
  5. Modified_New_Window
  6. This template set also meets a specific need - to be able to determine the characteristics of the pop-up window into which linked images may be launched. You can edit the template to customise this as required - by default, the linked images pop up in a named resizable window, 800 pixels wide by 750 pixels high, with no toolbar or scrollbars.
  7. Frameset_Default
  8. This provides a basic framed view of the images.
  9. Frameset_Order_by_Email
  10. Similar to (2) but in a frameset format.

Shown below are details of the placeholder 'macros' you can use for each template:

Thumbnail template
Listed below are the placeholders available for the thumbnail HTML pages. To view the default template that uses these, click [here]


  <!--title-->              Page title
  <!--pagenumber-->         Page number
  <!--images-->             Block of code containing images and formatting for the page
  <!--slideshowlink-->      Text of slideshow link
  <!--otherpagelinks-->     Text for links to other pages
  <!--progver-->            ThumbHTML version
  <!--date(mm/dd/yyyy)-->   Current date (replace date format as required)
  <!--time(hh:mm)-->        Current time (replace time format as required)
  <!--year-->               Current year
  <!--footer-->             Footer (can include other macros)
  <!--movielinks-->         Links to movie files in the root folder (.mov, .mpg, .avi, .wmv)
  <!--norightclick-->       Javascript to prevent right-clicking
  <!--image1-->             Placeholder for image 1
  <!--image2-->             Placeholder for image 2 etc

Individual template
Listed below are the placeholders available for the individual HTML pages. To view the default template that uses these, click [here]


  <!--title-->              Page title
  <!--imagenumber-->        Image number
  <!--totalnumber-->        Total number of images in this set
  <!--imagenumberfilenamerow-->  Image number and filename on one row
  <!--filename-->           Filename
  <!--photodatetime-->      Date and time of image
  <!--photodata-->          Picture data
  <!--leftnavlinks-->       Navigation links (left)
  <!--mainpicture-->        Block of code containing the image itself
  <!--rightnavlinks-->      Navigation links (right)
  <!--copyright-->          Copyright information, if it exists
  <!--caption-->            Picture comments/caption
  <!--backtolink-->         Link to calling page and home page (if different)
  <!--alsoavailable-->      Links to other sizes of this image
  <!--progver-->            ThumbHTML version
  <!--date(mm/dd/yyyy)-->   Current date (replace date format as required)
  <!--time(hh:mm)-->        Current time (replace time format as required)
  <!--year-->               Current year
  <!--footer-->             Footer (can include other macros)
  <!--firstimagefile-->     Filename of the first file in the list (blank if this IS the first)
  <!--finalimagefile-->     Filename of the final file in the list (blank if this IS the last)
  <!--previmagefile-->      Filename of the previous file in the list (blank if current is first)
  <!--nextimagefile-->      Filename of the next file in the list (blank if current is last)      
  <!--parentpage-->         URL of the page from which this page called
  <!--homepage-->           URL of the index page for this set of images
  <!--norightclick-->       Javascript to prevent right-clicking
  <!--navurl-->             URL of the navigation images (empty if these are in the image folder)

Slideshow template
Listed below are the placeholders available for the slideshow HTML page. To view the default template that uses these, click [here]


  <!--title-->              Page title
  <!--filename-->           Filename
  <!--imagecount-->         Image count
  <!--photodate-->          Photo datetime
  <!--photodetails-->       Photo details
  <!--descriptions-->       Photo comments
  <!--image-->              The actual image
  <!--mainimagepagelink-->  Link to main image thumbnail page
  <!--progver-->            ThumbHTML version
  <!--date(mm/dd/yyyy)-->   Current date (replace date format as required)
  <!--time(hh:mm)-->        Current time (replace time format as required)
  <!--footer-->             Footer (can include other macros)

Template for Individual Thumbnails, with hyperlink
Listed below are the placeholders available for the individual thumbnail HTML, as used inside the thumbnail pages. To view the default template that uses these, click [here]


  <!--image_url-->        URL of individual linked-image web page
  <!--image_filename-->   Filename (not path) of the individual image
  <!--image_width-->      Width of image, in pixels
  <!--image_height-->     Height of image, in pixels
  <!--caption-->          Image caption (comments)
  <!--wintarget-->        If you use this, the program will use the relevant checkbox to 
                                decide whether to pop a new window up in the "_new" window frame

Template for Individual Thumbnails, without hyperlink
Listed below are the placeholders available for the individual thumbnail HTML, as used inside the thumbnail pages. To view the default template that uses these, click [here]


  <!--image_filename-->   Filename (not path) of the individual image
  <!--image_width-->      Width of image, in pixels
  <!--image_height-->     Height of image, in pixels
  <!--caption-->          Image caption (comments)

Frameset Index Template
To view the default template that uses these, click [here]


  <!--title-->               Album title
  <!--progver-->             ThumbHTML version
  <!--date(mm/dd/yyyy)-->    Current date (replace date format as required)
  <!--time(hh:mm)-->         Current time (replace time format as required)
  <!--year-->                Current year
  <!--firstpage-->           URL of first page in list of linked-image pages

Frameset Top Template
To view the default template that uses these, click [here]


  <!--title-->              Album title
  <!--totalnumber-->        Total number of images in this set
  <!--progver-->            ThumbHTML version
  <!--date(mm/dd/yyyy)-->   Current date (replace date format as required)
  <!--date-->               Current date (use date provided by ThumbHTML)
  <!--time(hh:mm)-->        Current time (replace time format as required)
  <!--year-->               Current year   
  <!--homepage-->           URL of the index page for this set of images
  					(goes to _top - i.e. breaks out of frameset)

Frameset Left (Navigation) Template
To view the default template that uses these, click [here]


  <!--title-->              Page title
  <!--images-->             Block of code containing images and formatting for the page
  <!--slideshowlink-->      Text of slideshow link
  <!--otherpagelinks-->     Text for links to other pages
  <!--progver-->            ThumbHTML version
  <!--date(mm/dd/yyyy)-->   Current date (replace date format as required)
  <!--time(hh:mm)-->        Current time (replace time format as required)
  <!--year-->               Current year
  <!--footer-->             Footer (can include other macros)
  <!--movielinks-->         Links to movie files in the root folder (.mov, .mpg, .avi, .wmv)
  <!--validxhtmlicon-->    Adds the 'valid XHTML' icon
  <!--norightclick-->            Javascript to prevent right-clicking

Frameset Main (Linked Image) Template
To view the default template that uses these, click [here]


  <!--title-->               	 Album title
  <!--imagenumber-->         	 Image number
  <!--imagecountandnumber--> 	 Image count and number, e.g. "Image 5 of 30"
  <!--totalnumber-->         	 Total number of images in this set
  <!--imagenumberfilenamerow-->  Image number and filename on one row
  <!--filename-->           	 Filename
  <!--photodatetime-->      	 Date and time of image
  <!--photodata-->          	 Picture data
  <!--mainpicture-->        	 Block of code containing the image itself
  <!--copyright-->          	 Copyright information, if it exists
  <!--caption-->            	 Picture comments/caption
  <!--alsoavailable-->      	 Links to other sizes of this image
  <!--progver-->            	 ThumbHTML version
  <!--date(mm/dd/yyyy)-->   	 Current date (replace date format as required)
  <!--date-->               	 Current date (use date provided by ThumbHTML)
  <!--time(hh:mm)-->        	 Current time (replace time format as required)
  <!--year-->               	 Current year   
  <!--homepage-->           	 URL of the index page for this set of images
  							(goes to _top - i.e. breaks out of frameset)
  <!--norightclick-->          Javascript to prevent right-clicking
  
  <!--exif_make-->             Camera manufacturer 
  <!--exif_model-->            Camera model 
  <!--exif_image_dim-->        Image dimensions, in pixels (e.g. 1600x1200)
  <!--exif_aperture-->         Aperture (f-stop)
  <!--exif_focallength-->      Effective focal length (e.g. 90mm)
  <!--exif_shutterspeed-->     Shutter speed (e.g. 1/90s)
  <!--exif_image_quality-->    Image quality
  <!--exif_iso-->              Effective ISO rating (e.g. 100)
  <!--exif_copyright-->        Contents of copyright tag, if present
  <!--exif_artist-->           Contents of artist tag, if present
  <!--exif_program-->          Program mode
  <!--exif_metering-->         Metering mode
  
  <!--image_filesize-->        Image filesize (Kb)

Frameset Template for Individual Thumbnails, with hyperlink
To view the default template that uses these, click [here]


  <!--image_url-->         URL of individual linked-image web page
  <!--image_filename-->    Filename (not path) of the individual image
  <!--image_width-->       Width of image, in pixels
  <!--image_height-->      Height of image, in pixels
  <!--caption-->           Image caption (comments)
  <!--wintarget-->         If you use this, the program will use the relevant checkbox 
  to decide whether to pop a new window up in the "_new" window frame


Back to the main page
    Revision history