An image gallery for Plone using ColorBox
Project description
Introduction
ColorBox is a lightweight customizable lightbox plugin for jQuery. More information about ColorBox can be found here: http://jacklmoore.com/colorbox/
In Plone 4 ftw.colorbox also adds a view called colorbox_view for folders and topics which provides a ColorBox gallery when images are clicked on. The above view has been removed in Plone 5, though we are open to restoring it via a PR.
Caveat
As noted in the colorbox source code you must ensure that colorbox’s CSS is loaded before its JavaScript.
Configuration
Configuration options are stored in the configuration registry (plone.app.registry).
- colorbox_config
The options passed to the colorbox function (see ColorBox documentation for more details). Provide one option per line. Example:
transition: "fade" speed: 250 maxWidth: "90%" maxHeight: "90%"
The following configuration options ONLY apply to the colorbox_view on Plone 4.
- image_size
The name of an image size configured in the imaging control panel (e.g. large). If no size is given (default) images will be displayed in original size.
- batch_size
The number of thumbnails shown on a page. Default is 12.
- row_size
The number of images shown per row. If set to 0 (default) all images are floated in the same row.
Links
Copyright
This package is copyright by 4teamwork.
ftw.colorbox is licensed under GNU General Public License, version 2.
Changelog
1.6.2 (2020-05-10)
Do not use css bundles in plone 5, since url is no longer working. [mathias.leimgruber]
1.6.1 (2020-05-08)
Do not add resource url css in bundles [mathias.leimgruber]
1.6.0 (2020-04-23)
Wait for document ready to initialize colorbox. [djowett-ftw]
Define ‘ftwcolorbox_init’ as an AMD module. [djowett-ftw]
1.5.1 (2019-12-18)
Fix bug when ftw.colorbox is not installed but in the path. [jone]
1.5.0 (2019-12-18)
Move resources to its own bundle for plone 5. [mathias.leimgruber]
Bundle JS & CSS resources with Yarn. [djowett-ftw]
Add uninstall profiles for plone 4 and 5. [djowett-ftw]
Breaking changes
Remove colorbox_view in Plone 5. [djowett-ftw]
Remove colorbox.js - it only put the title off-centre, making things worse rather than better. [djowett-ftw]
1.4.0 (2019-08-21)
Add option to exclude images by a javascript expression [Nachtalb]
1.3.0 (2018-04-04)
Remove empty space when no counter is displayed and improve mobile styling. [raphael-s]
Add plone 5 default profile. [mathias.leimgruber]
Fix rendering of empty colorbox title. [Kevin Bieri]
1.2.4 (2017-01-23)
The caption of the colorbox can now be provided by putting a “data-caption” attribute on the link opening the colorbox. [mbaechtold, mathias.leimgruber]
1.2.3 (2015-12-23)
Adjust border size of overlay for ftw.theming. [Kevin Bieri]
Declare missing dependency to the “Plone” egg. [jone]
1.2.2 (2015-09-30)
Add test setup. [mbaechtold]
Add image scale so the image dimensions can be configured. [mbaechtold]
1.2.1 (2015-06-26)
Exclude colorbox-initialization into a function [elioschmutz]
1.2.0 (2014-09-23)
Made colorbox fullscreen and repositioned forward/back buttons. [lknoepfel]
Updated library to v1.5.9. [lknoepfel]
Update French and English translations. [jone]
1.1.4 (2013-04-16)
Fix jq issue in JavaScript by fixing the scope and using $. [mathias.leimgruber]
1.1.3 (2012-05-14)
Fix MANIFEST.in [mathias.leimgruber]
1.1.2 (2012-05-14)
Fix package structure. [mathias.leimgruber]
1.1.1 (2012-05-14)
Implement a default js, which looks for colorboxLink css class. [tschanzt]
1.1 (2012-02-14)
Make batch size of colorbox view configurable in the registry. [Thomas Buchberger]
Wrap each row of images in a div for easier styling. The number of images per row can be configured in the registry. [Thomas Buchberger]
Make ColorBox options configurable in the registry. [Julian Infanger]
Allow to specify an image size for the overlay. [Julian Infanger]
CSS and JS in head slots should not be in a div. [Julian Infanger]
1.0.1 (2011-12-05)
Addeed maxWidth and maxHeight. Images should not be bigger than 100%. [Julian Infanger]
1.0 (2011-02-25)
Initial release.
Project details
Release history Release notifications | RSS feed
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.