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.
On recent Foswiki installations (>=1.1.x) the functionality of this plugin is replaced with
JQuerySlimbox. The Lightbox Plugin will only properly initialize if TWiki Plugin Version <1.2, so if you still want or have to use it, then you also must enable the
TWikiCompatibilityPlugin.
Usage
- Attach images and thumbnails to a topic
- Use one of the lightbox Foswiki tags to display the thumbnail image.
Syntax
To add lightbox functionality to a Foswiki topic, use
%LIGHTBOX{ _options_ }%
or
%BEGINLIGHTBOX{ _options_ }%
_text_
%ENDLIGHTBOX%
If successful, a dotted box with a clickable thumbnail should appear.
option |
default |
comments |
image |
'' |
The large display image |
thumbnail |
'' |
The click-able thumbnail image |
float |
'right' |
thumbnail placement on topic page |
border |
see below |
thumbnail border style |
caption |
'' |
caption to appear in thumbnail img alt tag and under large image |
Note, Foswiki-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 Foswiki is running.
- Download the ZIP file from the Plugin Home (see below)
- Unzip
LightboxPlugin.zip
in the root of your Foswiki installation
Content: File: | Description: |
data/System/LightboxPlugin.txt | plugin description |
lib/Foswiki/Plugins/LightboxPlugin.pm | plugin perl code |
pub/System/LightboxPlugin/lightbox.css | stylesheet |
pub/System/LightboxPlugin/lightbox.js | javascript |
pub/System/LightboxPlugin/blank.gif | empty image |
pub/System/LightboxPlugin/close.gif | close image button |
pub/System/LightboxPlugin/loading.gif | image loading animation |
pub/System/LightboxPlugin/overlay.png | overlay image |
pub/System/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 = Foswiki hooks to the Lightbox Javascript package for better thumbnail image click-through
This Foswiki extension includes v1.0 of Lightbox.
Related Topic: Foswiki:Extensions.ImageGalleryPlugin
Contributors:
TWiki:Main/HenriAanstoot,
Foswiki:Main/ScottHoge