Project

General

Profile

Actions

Feature #23528

closed

Allow easy use of lightbox style image enlargement in the frontend

Added by Susanne Moog about 14 years ago. Updated over 13 years ago.

Status:
Closed
Priority:
Should have
Assignee:
Category:
Communication
Target version:
-
Start date:
2010-09-12
Due date:
% Done:

0%

Estimated time:
PHP Version:
5.3
Tags:
Complexity:
Sprint Focus:

Description

At the moment the click-enlarge feature for images is implemented as good ol' popup window and without deeper knowledge of css styled contents workings it is pretty hard to change this to a lightbox style image enlargement (changing css classes and rel attribute).

This patch implements an easier way by offering three new constants:
Lightbox click-enlarge rendering -> Whether or not lightbox rendering is enabled
Lightbox CSS class -> the CSS class to use in the image link
Lightbox rel="" attribute -> the rel="" attribute to use

This enables the user to get lightbox compliant rendering by changing these constants for the following lightbox scripts:
CeeBox, ColorBox, Facebox, Lightbox, Lightbox+, Lightbox2, Lighter Box 2, LightWindow 2, Lytebox, mediaboxadvanced, Milkbox, nyroModal, Pirobox, PrettyPhoto, Slightly ThickerBox, Slimbox2, Thickbox, TopUp

(I did only test CeeBox, Colorbox, Lightbox2, nyroModal and Thickbox, but from the documentation the others should work as well)

Documentation for new properties:

CSS Styled Content:
Constants > styles.content.imgtext.linkWrap:

Property: lightboxEnabled
Datatype: string
Description: If set, images will be rendered with a link to their big version and a specified css class and rel attribute to easily allow the use of lightboxes
Default: 0

Property:lightboxCssClass
Datatype: string
Description: Which CSS class to use for lightbox links (only applicable if lightbox rendering is enabled)
Default: lightbox

Property: LightboxRelAttribute
Datatype: string
Description: Which rel="" attribute to use for lightbox links (only applicable if lightbox rendering is enabled)
Default: lightbox[{field:uid}]

TSRef:
imageLinkWrap:
Change datatype of JSwindow to "boolean / stdWrap"

Add property:
Property: directImageLink
Datatype: boolean
Description: If true, a link to the generated image file will be returned directly (showpic.php is not used)
Add property:
Property: linkParams
Datatype: typolink
Description: Allows the manipulation of the generated typolink if JSwindow is not used. Example:
linkParams.ATagParams.dataWrap = class="{$styles.content.imgtext.linkWrap.lightboxCssClass}" rel="{$styles.content.imgtext.linkWrap.lightboxRelAttribute}"

(issue imported from #M15689)


Files

15689_v1.diff (5.76 KB) 15689_v1.diff Administrator Admin, 2010-09-12 16:02
15689_documentation_v1.txt (1.19 KB) 15689_documentation_v1.txt Administrator Admin, 2010-09-12 16:03
Actions #1

Updated by Susanne Moog about 14 years ago

rev 8782

Actions #2

Updated by Susanne Moog over 13 years ago

  • Target version deleted (4.5.0)
Actions

Also available in: Atom PDF