Difference: LightboxPlugin (1 vs. 2)

Revision 22020-06-25 - TWikiAdminUser

Line: 1 to 1
 

Lightbox Plugin

Revision 12020-06-25 - TWikiAdminUser

Line: 1 to 1
Added:
>
>

Lightbox Plugin

<--
   Contributions to this TWiki plugin are appreciated. Please update the plugin page at
   http://twiki.org/cgi-bin/view/Plugins/LightboxPlugin or provide feedback at
   http://twiki.org/cgi-bin/view/Plugins/LightboxPluginDev.
   If you are a TWiki contributor please update the plugin in the SVN repository.
-->
TWiki hooks to the Lightbox Javascript package for better thumbnail clickthrough

Introduction

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 Variable to display the thumbnail image

Syntax

To add lightbox functionality to a TWiki 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 title tag and under large image

Note, TWiki-wide defaults can be set using

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

  • IDEA! 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

You type You get Simulated thumbnail
%LIGHTBOX{
  image="Dsc05040.jpg"
  thumbnail="Dsc05040-thumb.jpg"
  caption="Rocket is ready for launch"
}%
Rocket is ready for launch

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/Dsc05040.jpg image example
    pub/TWiki/LightboxPlugin/Dsc05040-thumb.jpg image example
    pub/TWiki/LightboxPlugin/Dsc05040-simulated.jpg image example
  • Enable the plugin in configure or LocalSite.cfg
  • Test above example if the installation was successful

Plugin Info

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

This TWiki extension includes v1.0 of Lightbox.

Plugin Author: TWiki:Main.HenriAanstoot, TWiki:Main.ScottHoge
Copyright: © 2006, TWiki:Main.HenriAanstoot
© 2006-2010 TWiki:TWiki/TWikiContributor
License: GPL (GNU General Public License)
Plugin Version: 2010-11-09 - 19812 (2010-11-09)
Change History:
<-- versions below in reverse order -->
 
2010-11-09: TWikibug:Item6530: Doc improvements, adding proper image example -- TWiki:Main.PeterThoeny
5 Apr 2007: Added blank.gif to the package
23 Mar 2007: Added plugin code with TWiki Variables
22 Sep 2006: Initial version
TWiki Dependency: $TWiki::Plugins::VERSION 1.1 (TWiki 4.0)
CPAN Dependencies: none
Other Dependencies: none
Perl Version: 5.005
Plugin Home: http://TWiki.org/cgi-bin/view/Plugins/LightboxPlugin
Feedback: http://TWiki.org/cgi-bin/view/Plugins/LightboxPluginDev
Appraisal: http://TWiki.org/cgi-bin/view/Plugins/LightboxPluginAppraisal

Related Topic: TWiki:Plugins.ImageGalleryPlugin

META FILEATTACHMENT attachment="Dsc05040.jpg" attr="h" comment="" date="1289370765" name="Dsc05040.jpg" path="Dsc05040.jpg" size="79278" user="TWikiContributor" version="1"
META FILEATTACHMENT attachment="Dsc05040-thumb.jpg" attr="h" comment="" date="1289370780" name="Dsc05040-thumb.jpg" path="Dsc05040thumb.jpg" size="8935" user="TWikiContributor" version="1"
META FILEATTACHMENT attachment="Dsc05040-simulated.jpg" attr="h" comment="" date="1289371726" name="Dsc05040-simulated.jpg" path="Dsc05040-simulated.jpg" size="17309" user="TWikiContributor" version="1"
 
This site is powered by the TWiki collaboration platform Powered by PerlCopyright © 1999-2024 by the contributing authors. All material on this collaboration platform is the property of the contributing authors.
Ideas, requests, problems regarding TWiki? Send feedback
Note: Please contribute updates to this topic on TWiki.org at TWiki:TWiki.LightboxPlugin.