Image Lightbox Application
 | Display images from the page content in a lightbox |
| Type | XAR |
| Category | Application |
| Developed by | |
| Active Installs | 140 |
| Rating | |
| License | GNU Lesser General Public License 2.1 |
Table of contents
Description
The image lightbox is a way of opening images from the page content in full screen mode, using the Blueimp Gallery library (available under the MIT license)
While hovering a image (see Image syntax for details on how to add images), a toolbar will appear near the cursor, with options for opening the image in lightbox mode, to download it, to get a direct link or to copy the image ID.
After clicking on the first option, the image is opened in full screen with some information and more actions to apply. At this step, you can navigate through all images available in the content of the current page using keyboard and on-screen arrows, or the thumbnails at the bottom of the lightbox.
You can toggle the visibility of the image caption and action buttons by clicking on the image.
Actions
From the top right menu, the following actions can be applied:
- toggle the browser full screen mode
- download the current image
- copy the image ID (which is either manually added using the Numbered Reference Macro, or automatically generated)
- start / stop a carousel play of all images
- close the lightbox; this can be achieved also by using Esc key or with a click outside the image
Description box
By default, if the image is an attachment to a page, the description box will provide information about date of upload and author, along with the image alternative text or file name.
If captions are added to an image (see Figure Macro for more details on how to do so), this will be displayed as part of the description.
In case the image is external, the description will display only the caption / alternative text, if this is not actually the image url, or the file name, when it can be extracted.
Administration section
The lightbox functionality is enabled by default. It can be disabled from the global Administration, Look & Feel -> Lightbox section.
Disable for specific content
The lightbox functionality can be disabled for an element and its children by adding data-xwiki-lightbox="false" to the parent of the excluded content, or directly on the targeted element. This can be used by macros or extensions rendering images as part of the page content so that these images don't appear in the lightbox view.
