Lightbox Plugin

Lightbox is set of Javascript and CSS files that provides improved image viewing functionality. When a user clicks on the image, the full size image will display without advancing the browser to a new page.

Usage

• Attach images and thumbnails to a topic
• Use one of the lightbox TWiki tags to display the thumbnail image.

Syntax

To add lightbox functionality to a TWiki topic, use

   %LIGHTBOX{ _options_ }%

   %BEGINLIGHTBOX{ _options_ }%
   _text_
   %ENDLIGHTBOX%

If successful, a dotted box with a clickable thumbnail should appear.

Note, TWiki-wide defaults can be set using

• Set LIGHTBOXPLUGIN_BORDER = 1px dashed #22638C
• Set LIGHTBOXPLUGIN_FLOAT =

• If your text is to short, the thumbnail will overlap use height to fix this.

   <div style="border:1px dashed #22638c;padding:4px;height:200px; ">

Example

%LIGHTBOX{ image="img-test.jpg"  thumbnail="tmb-test.jpg" caption="This is a test"}%

Plugin Installation Instructions

Note: You do not need to install anything on the browser to use this plugin. The following instructions are for the administrator who installs the plugin on the server where TWiki is running.

• Download the ZIP file from the Plugin Home (see below)
• Unzip LightboxPlugin.zip in the root of your twiki installation
  Content:

  File:	Description:
  data/TWiki/LightboxPlugin.txt	plugin description
  lib/TWiki/Plugins/LightboxPlugin.pm	plugin perl code
  pub/TWiki/LightboxPlugin/lightbox.css	stylesheet
  pub/TWiki/LightboxPlugin/lightbox.js	javascript
  pub/TWiki/LightboxPlugin/blank.gif	empty image
  pub/TWiki/LightboxPlugin/close.gif	close image button
  pub/TWiki/LightboxPlugin/loading.gif	image loading animation
  pub/TWiki/LightboxPlugin/overlay.png	overlay image
  pub/TWiki/LightboxPlugin/ScreenShot001.jpg	thumbnail example

• Enable the plugin in configure or LocalSite.cfg
• Test if the installation was successful:
  • A dotted box with a clickable thumbnail should appear.
    

Plugin Info

• Set SHORTDESCRIPTION = TWiki hooks to the Lightbox Javascript package for better thumbnail clickthrough

This TWiki extension includes v1.0 of Lightbox.

Related Topic: TWiki:Plugins.ImageGalleryPlugin

Contributors: TWiki:Main/HenriAanstoot, TWiki:Main/ScottHoge