Differences

This shows you the differences between two versions of the page.

Link to this comparison view

ttg_html_gallery [2011/12/13 00:31]
matthew created
ttg_html_gallery [2011/12/13 00:34] (current)
matthew
Line 14: Line 14:
   * Seamless integration with TTG Pages.   * Seamless integration with TTG Pages.
   * Supports use with TTG Auto Index.   * Supports use with TTG Auto Index.
 +
 +===== System Requirements =====
 +
 +TTG HTML Gallery is written in Lua and requires Adobe Lightroom 2.x or higher.
 +
 +===== Hosting Requirements =====
 +
 +We recommend hosts running Linux OS and Apache web server. [[ Bluehost|Need hosting?]]
 +
 +===== Installation =====
 +
 +By installing any purchased or downloaded web engine, plugin or template from The Turning Gate (TTG), You, the user, agree to the [[End User License Agreement]]. Make a point to read this document, as it contains important information regarding your purchase and your rights as a user, for which you are responsible.
 +
 +[[Installation|Read the web engine installation instructions]].
 +
 +===== onImage Navigation ===== 
 +
 +{{:ce:html_onimagenav1-550x366.jpg?| Showing active navigation regions for images in TTG HTML Gallery.}}
 +
 +**onImage Navigation** is an image overlay navigation system, comprised only of HTML and CSS, that allows the user to browse the gallery and return to the index by hovering their mouse over regions of the on-screen image. It has been tested successfully in Firefox, Safari, Opera, and Internet Explorer 6 and 7.
 +
 +The above image shows the areas of interaction. Clicking inside the left 40% of the image, indicated in yellow, will take the user to the previous image. Clicking in the right 40% of the image, indicated in red, will take the user to the next image. And clicking in the upper center region, indicated in blue, will allow the user to return to the image index. On hover, icons will appear to indicate the region’s function.
 +
 +By clicking in the lower center region, empty in the above image, the user can left or right-click the image to interact with it in the usual fashion. For example, the user could bring up the right-click menu and save the image to their hard drive.
 +
 +These areas resize dynamically to accommodate images of any size or orientation.
 +
 +===== Applying Colors and Ratings =====
 +
 +In order to apply color labels and numerical ratings to thumbnails, class names must be set for each image. By default, the gallery pulls these class names from the Headline IPTC field. This can be changed via the Image Info panel, however.
 +
 +Images may each be assigned a single rating and/or color. To apply a color, simply enter the name of the color into the Headline IPTC field. Accepted colors are transparent, red, yellow, green, blue and purple.
 +
 +To assign a numerical rating, type out the word for the number of stars/circles you’d like to apply. Accepted values are zero, one, two, three, four and five.
 +
 +In order to assign both a color and a numerical rating, enter one of each, separated by a space. For example, to label an image red with a rating of five, you would enter red five into the Headline IPTC field.
 +
 +Of course, you may elect to leave the Headline IPTC field empty, in which case neither a color label or numerical rating will be applied to the image.
 +
Print/export