=== WP jQuery Lightbox ===
Contributors: pandaboxwp
Tags: lightbox, photo, image, gallery
Requires at least: 5.0
Tested up to: 6.4.3
Stable tag: 1.5.3
Requires PHP: 7.0
License: GPLv2 or later
Very simple and lightweight lightbox plugin for WordPress. Formerly the 'WP JQuery Lightbox'.
== Description ==
A simple, lightweight WordPress lightbox plugin. [See demo here](https://pandaboxwp.com).
**Features**
* Automattically detect images so they open in a lightbox with no need to adjust markup.
* Works seamlessly with WordPress core images and galleries, and galleries from many plugins.
* Play or puase slideshow within lightbox.
* Enhanced mobile support with swipe gestures on touch devices, improved scaling to maximizes use of screen space, and live adjustment to the browser window and orientation of your phone.
* Browse images with your keyboard: Arrows, P(revious)/N(ext) and X/C/ESC for close.
* Admin panel to configure options. sv
* Localization support.
* Lightweight and fast.
See the plugin in action here: [pandaboxwp.com](https://pandaboxwp.com)
**Background and Thanks**
Special thanks to [Ulf Benjaminsson](http://www.ulfbenjaminsson.com), who created this plugin and maintained it for many years.
This plugin lets you keep [Lightbox 2](http://www.huddletogether.com/projects/lightbox2/) functionality but sheds the bulk of the Prototype Framework and Scriptaculous Effects Library. Warren Krewenki [ported Lightbox to jQuery](http://warren.mesozen.com/jquery-lightbox/) and this plugin is mostly a wrapper to his work.
== Screenshots ==
1. Default frontend appearance.
== Installation ==
1. Upload the `wp-jquery-lightbox`-folder to the `/wp-content/plugins/` directory
1. Activate the plugin through the 'Plugins' menu in WordPress
1. Check out the jQuery Lightbox-panel in your admin interface for usage details and configuration.
= How to Use: =
1. With [WordPress built-in gallery](http://codex.wordpress.org/Gallery_Shortcode): [`[gallery link="file"]`](http://codex.wordpress.org/Gallery_Shortcode)
1. All galleries in a post make a single slideshow. To create separate slideshows, use `group`:
`[gallery link="file" ids="1,2,3" group="mon"]`
`[gallery link="file" ids="4,5,6" group="tue"]`
1. You can manually add a `rel="lightbox"` attribute to any link:
`<a href="image-1.jpg" rel="lightbox" title="my caption">image #1</a>`
Note the use of title-attribute to set a caption
1. To manually group sets of related images, follow step 3 but additionally include a group name in the `rel` attribute:
`<a href="image-1.jpg" rel="lightbox[roadtrip]">image #1</a>`
`<a href="image-2.jpg" rel="lightbox[roadtrip]">image #2</a>`
`<a href="image-3.jpg" rel="lightbox[roadtrip]">image #3</a>`
1. You can use the `data-download` attribute to set a custom download link:
`<a href="image-medium.jpg" rel="lightbox" data-download="image-superlarge.jpg"> [...] </a>`
1. To *disable* lightboxing of an image link, just set any other rel-attribute: `rel="nobox"`
1. Keyboard support: Arrows, P(revious)/N(ext) and X/C/ESC for close. Swipe left / right on touch devices.
1. [Infinite-Scroll](http://wordpress.org/extend/plugins/infinite-scroll/) and similar "endless pages"-plugins should call `doLightbox();` whenever it loads new content. Check your plugin for a setting
named "callbacks" - code that is called after each new page is loaded. Add this line;
`if(typeof doLightBox !== 'undefined' && typeof jQuery !== 'undefined'){
doLightBox();
}`
1. On the server side you can apply lightbox to any content by running `jqlb_apply_lightbox($your_html_content, "any ID");` It returns a string with all image links lightboxed, grouped by `"any id"`.
= Trouble shooting: =
If you have problems with WP jQuery Lightbox, please make sure you try these steps before asking for help. If you ask for help and I find any of these steps would fix the problem, I will just link you back here to do the work yourself.
1. Make sure your site is not throwing any javascript errors. Use [your browsers javascript console](http://webmasters.stackexchange.com/questions/8525/how-to-open-the-javascript-console-in-different-browsers) to find out.
If you're running a custom theme:
1. Make sure you have [`wp_head();`](http://codex.wordpress.org/Function_Reference/wp_head) just before the closing `</head>` tag of your theme, or you will break many plugins, which generally use this hook to reference JavaScript files.
1. For the same reason, always have `wp_footer();` just before the closing `</body>` tag of your theme.
1. Many JavaScript optimizers, combiners, minifiers, etc. conflict with [`wp_localize_script`](http://codex.wordpress.org/Function_Reference/wp_localize_script2), used to configure this plugin and many others.
* If you have problems with jQuery Lightbox; first disable all JavaScript-optimizing plugins. (Optimize Scripts, W3 Total Cache, WP Minify etc)
* If you develop JavaScript optimizers for WordPress, please play nice with the default API...
* [More info about this issue](http://wordpress.org/support/topic/122-worked-13-does-not-work-for-me?replies=19)
Lastly:
1. Disable all other plugins, one at a time. Try the lightbox between each.
1. Revert to the default theme. Did it help? Fix your theme.
1. Search the forums for similar symptoms.
Still have problems? Post a link and describe what issue you're having, and tell us what of these steps you've already tried.
== Changelog ==
= 1.5.3 (2024-03-12) =
* Improve mobile panzoom behavior
* Remove nav for single images
* Option to use alt as title
= 1.5.2 (2024-03-12) =
* Fix new nav arrow size
= 1.5.1 (2024-03-12) =
* Replace dashicons with svg for nav arrows
= 1.5 (2024-03-07) =
* Added new nav arrow style options
* Added overlay color/opacity options
* Added border color/width options
* Added image shadow option
* Added option to hide infobar
* Improved styling
= 1.4.9.3 (2024-02-08) =
* Added pinch-to-zoom support for mobile
* Improved mobile styling
= 1.4.9.2 (2024-01-12) =
* Update author and contributors
* Update tested WordPress version
* Update minimum PHP version to 7.0
= 1.4.9.1 (2023-11-05) =
* Add webp support
* Remove donation links
= 1.4.9 (2023-11-03) =
* Updated readme author and description
* Fixed image centering on small screens
* Removed white space from end of lines
* Updated default settings for resize_on_demand and margin_size
* Capitalized slideshow links
= 1.4.8.4 (2023-10-24) =
* Removed screenshots and banner image from repository
= 1.4.8.3 (2021-01-26) =
* Added setting to control whether jQuery is loaded in the header or footer.
= 1.4.8.2 (2021-01-26) =
* Migrated lightbox to modern jQuery (Thanks: [Joseph Rézeau aka papijo](https://www.rezeau.org/)!)
* Improved support of Gutenberg editor's image captions (Thanks: [Joseph Rézeau aka papijo](https://www.rezeau.org/)!)
* Tested up to WordPress 5.6 and PHP 7.4.12
= 1.4.8.1 (2019-03-24) =
* Tested for WordPress 5.x and PHP 7.0
= 1.4.8 (2015-12-31) =
* Fixed translations not being loaded properly
* Fixed support for WordPress 4.4
= 1.4.7 (2015-09-21) =
* Support for WordPress' new translation system.
* Updated translation for Portugese (Thanks: Pedro Mendonça)
* Added images and CSS for Portugese (Thanks: Pedro Mendonça)
= 1.4.6 (2015-03-20) =
* "Download link" now correctly open a download dialogue instead of displaying the file
* Title, caption and all control elements can now be turned on / off individually
* Added support for custom style sheets (just copy original to your theme's style folder, and hack away)
* Restructured the HTML slightly, making styling easier
* Added specific CSS selectors for all elements
* Fixed animation speed setting being ignored
* Dropped quirks support for Internet Explorer 8
* Removed help-text setting
= 1.4.5 (2013-06-09) =
* Fit to screen edge on low rez displays (<500px)
* Added global setting to hide title & caption
* Reduced the amount of code running for each image shown
* Updated German translation (thanks [Niko23](http://wordpress.org/support/topic/translation-of-client-side-text?replies=5#post-4230050))
* Fix: swipe direction
* Fix: slideshow now waits for images to display before starting timer.
* Fix: support for latest jQuery
* Fix: WordPress encoding wrong quote mark in captions, causing duplicate texts to display.
= 1.4.1 (2013-02-03) =
* Added swipe gestures on touch devices
* Added slideshow
* Added support for multiple sets in one post (use: [`group`](http://wordpress.org/extend/plugins/wp-jquery-lightbox/installation/) with the gallery-shortcode)
* Added support for arbitrary Download links via the [`data-download`-attribute](http://wordpress.org/extend/plugins/wp-jquery-lightbox/installation/)
* Added support to pick text from the image ALT-attribute (if title is not available)
* Added translations: Norwegian Bokmål (thanks [Ole Martin Kristiansen](http://hvorerole.com/)!)
* Fix regexp to deal with urls like www.gif.org. (Thanks Yannick Berker!)
* Fix changed common IDs to avoid collisions. (you'll have to update your CSS now!) (Hat tip; Pollmann Frederic)
* Fix better support of Infinite Scroll and similar
* Fix toggling visible state on unrelated object, embed and select nodes. [mwolfe02](http://wordpress.org/support/topic/lightbox-shows-hidden-selectembedobject-blocks?replies=1)
* Fix leaky CSS on admin page
= 1.3.4.2 (2011-02-01) =
* Fallbacks for people using older jQuery
= 1.3.4.1 (2011-01-31) =
* Updated deprecated jQuery calls (thanks; David Naber)
= 1.3.4 (2011-12-29) =
* Maybe fix for [mixed HTTP/HTTPS sites](http://wordpress.org/support/topic/mixed-http-and-https-installation-problems)
* [Support for query params in image links](http://wordpress.org/support/topic/automatic-lightbox-functionarity-failes-to-work-with-image-links?replies=2#post-2302997)
* [Fixed button messup in Firefox](http://wordpress.org/support/topic/plugin-wp-jquery-lightbox-broken-in-firefox?replies=9)
* Fixed depth fight with the default twentyeleven theme header
* [Fixed admin bar covering the lightbox](http://wordpress.org/support/topic/plugin-wp-jquery-lightbox-show-download-link-not-working?replies=4#post-2400784)
* Added info on how to disable lightbox for specific links (bogus rel-attribute)
* Added translations: [Romanian](http://wordpress.org/support/topic/wp-jquery-lightbox-romanian-translation?replies=1), [French](http://wordpress.org/support/topic/plugin-wp-jquery-lightbox-french-translation?replies=2#post-2187626) and [Hebrew](www.sagive.co.il)
* Updated: Russian language icons (thanks; Ilya Gorenburg), [Japanese translation](http://wordpress.org/support/topic/plugin-wp-jquery-lightbox-japanese-translation-for-133?replies=1)
= 1.3.3 (2011-06-12) =
* Fixes [for Internet Explorer](http://wordpress.org/support/topic/plugin-wp-jquery-lightbox-jquery-version-and-ie-issues) (A million thanks to [David Grayston](http://www.grayston.net/2011/internet-explorer-v8-and-opacity-issues/#more-342)!).
* Fix for [mixed HTTP/HTTPS installations](http://wordpress.org/support/topic/mixed-http-and-https-installation-problems).
* Added setting to have margins to screen edge.
* Added setting to put info & navigation on top.
* Added setting for help text.
* Added Japanese translation ([Thanks redcocker](http://wordpress.org/support/topic/plugin-wp-jquery-lightbox-japanese-translation)).
= 1.3.2 (2011-05-16) =
* Added support for auto-lightboxing comments too
* Added Russian and Czech translations (incl. images). Thanks again Denis!
* Added Polish translation ([thanks Fisiu](http://wordpress.org/support/topic/plugin-wp-jquery-lightbox-polish-localization?replies=1))
* Fixed fallbacks to avoid [breakage over JavaScript optimizers](http://wordpress.org/support/topic/122-worked-13-does-not-work-for-me?replies=19#post-2091734).
* Known issues: [1.3.x is garbage on IE7 and IE8](http://wordpress.org/support/topic/plugin-wp-jquery-lightbox-jquery-version-and-ie-issues?replies=3). I've got no clue and no time - **help appreciated!**
= 1.3.1 (2011-05-02) =
* Forgot to include languages files! :)
= 1.3 (2011-05-01) =
* Improved scaling to make maximum use of display area.
* Supports orientation / resize changes - Lightbox reflows with site.
* Added translation support (Thanks; [Martin S](http://sukimashita.com/) & Denis N. Voituk).
* Added option to display download link.
* Added support for disabling all animations (set duration to 0).
* Fixed "duration" not having an effect.
* [For Developers: public method to apply Lightbox to any string.](http://wordpress.org/extend/plugins/wp-jquery-lightbox/installation/)
= 1.2.2 (2011-04-14) =
* Use WordPress bundled jQuery instead of forcing the Google CDN
* Fixed the settings link on the Plugins page
= 1.2.1 (2010-10-24) =
* [Use only caption if title is identical](http://wordpress.org/support/topic/plugin-wp-jquery-lightbox-title-captions-bug-found-solved-and-fix-proposed?replies=8#post-1748874)
* Removed a forgotten debug call
= 1.2 (2010-10-12) =
* Added support for Media Library titles and captions.
* Minified the javascript (8.6KB vs 17.8KB)
* Minified the CSS (2.0KB vs 2.7KB)
= 1.1 (2010-10-09) =
* Honors empty captions.
* Fixed typos on admin page.
* [thanks, josephknight!](http://tinyurl.com/3677p6r)
= 1.0 (2010-04-11) =
* Release.
== Upgrade Notice ==
= 1.4.8 =
Fixed support for WordPress 4.4, Fixed translations not being loaded properly
= 1.4.7 =
New Portugese translation. Support for WordPress' new translation system.
= 1.4.6 =
Lots of bug fixes and performance improvements. New CSS styles!
= 1.4.5 (2013-06-09) =
Support latest jQuery. Better use of small screen estate, fixed buggy features (slideshow, swipes) and reduced system load.
= 1.4.1 =
Swipe gestures, slideshow, sets and lots of fixes. Check your config screen after update!
= 1.3.4.2 (2011-02-01) =
* Fallbacks for people using older jQuery
= 1.3.4.1 (2011-01-31) =
Updated deprecated jQuery calls (thanks; David Naber)
= 1.3.4 =
Lots of fixes, translations and support for the Admin Bar and Twentyeleven theme.
= 1.3.3 =
Fixes for Internet Explorer. Added Japanese translation.
= 1.3.2 =
Support for auto-lightboxing comments. Added Polish, Russian and Czech languages.
= 1.3.1 =
Added missing files from previous release... Also: mobile support, larger display area.
= 1.3 =
Enables larger viewing area, improved mobile experience and translations.
= 1.2.2 =
Use WordPress bundled jQuery instead of forcing the Google CDN
= 1.2.1 =
Removed forgotten debug call. Important upgrade!
= 1.2 =
Support caption and titles from the Media Library
= 1.1 =
Honors empty captions and fixes some typos.
= 1.0 =
First release.
== Frequently Asked Questions ==
= Trouble shooting: =
If you have problems with WP jQuery Lightbox, please make sure you try these steps before asking for help. If you ask for help and I find any of these steps would fix the problem, I will just link you back here to do the work yourself.
1. Make sure your site is not throwing any javascript errors. Use [your browsers javascript console](http://webmasters.stackexchange.com/questions/8525/how-to-open-the-javascript-console-in-different-browsers) to find out.
If you're running a custom theme:
1. Make sure you have [`wp_head();`](http://codex.wordpress.org/Function_Reference/wp_head) just before the closing `</head>` tag of your theme, or you will break many plugins, which generally use this hook to reference JavaScript files.
1. For the same reason, always have `wp_footer();` just before the closing `</body>` tag of your theme.
1. Many JavaScript optimizers, combiners, minifiers, etc. conflict with [`wp_localize_script`](http://codex.wordpress.org/Function_Reference/wp_localize_script2), used to configure this plugin and many others.
* If you have problems with jQuery Lightbox; first disable all JavaScript-optimizing plugins. (Optimize Scripts, W3 Total Cache, WP Minify etc)
* If you develop JavaScript optimizers for WordPress, please play nice with the default API...
* [More info about this issue](http://wordpress.org/support/topic/122-worked-13-does-not-work-for-me?replies=19)
Lastly:
1. Disable all other plugins, one at a time. Try the lightbox between each.
1. Revert to the default theme. Did it help? Fix your theme.
1. Search the forums for similar symptoms.
Still have problems? Post a link and describe what issue you're having, and tell us what of these steps you've already tried.
= Can the lightbox display the image description instead of the title? =
WP jQuery Lightbox grabs texts from three different HTML nodes;
1. `title`-attribute of link-to-image
1. `img` tag's `title` attribute (if 1 is empty)
1. `img` tag's `alt` attribute (if 1 and 2 is empty)
1. HTML content of `.gallery-caption` or `.wp-caption-text` (in that order)
Look at how the default TwentyTwelve theme uses these in its galleries and set up your theme so it outputs what you need in these places.
= I can see elements of my site through the overlay =
It's a problem of [z-index](http://www.w3schools.com/Css/pr_pos_z-index.asp). Check [the z-index property](http://www.w3schools.com/Css/pr_pos_z-index.asp) for the problematic elements, and force them to be less than 100. (Thanks [dway](http://wordpress.org/support/topic/plugin-wp-jquery-lightbox-title-captions-bug-found-solved-and-fix-proposed?replies=20#post-2052340)!)
= How do I add images to a post? =
[Inserting Images into Posts and Pages](http://codex.wordpress.org/Inserting_Images_into_Posts_and_Pages)
= How do I create a thumbnail gallery? =
Upload images to a post (see previous question) and use [WordPress' built-in gallery shortcode](http://codex.wordpress.org/Gallery_Shortcode): `[gallery link="file"]`
Note the `link="file"` - this is crucial! By default the gallery will link your humbnails to a page displaying your image. With `link="file"` the thumbnails links
directly to the image files - allowing Lightbox to function.
= Must fade-in and animation of all *box-scripts be so slow? =
WP-jQuery Lightbox lets you configure the animation duration and disable image resizing from the admin panel. Set duration to 0 to disable animations entirely.
= For developers: =
1. Always have `wp_footer();` just before the closing `</body>` tag of your theme, or you will break many plugins, which generally use this hook to reference JavaScript files.
1. Apply lightbox to any content by running `jqlb_apply_lightbox($your_content, "any ID");` It returns a string with all image links lightboxed, grouped by `"any id"`.
1. Many JavaScript optimizers, combiners, minifiers, etc. conflict with [`wp_localize_script`](http://codex.wordpress.org/Function_Reference/wp_localize_script2), used to configure this plugin and many others.
* If you have problems with jQuery Lightbox; first disable all JavaScript-optimizing plugins. (Optimize Scripts, W3 Total Cache, WP Minify etc)
* If you develop JavaScript optimizers for WordPress, please play nice with the default API...
* [More info about this issue](http://wordpress.org/support/topic/122-worked-13-does-not-work-for-me?replies=19)
= Can I help you in any way? =
Indeed you can!
Translations and help with implementing them would be nice.
== Additional Info ==
Copyright (C) 2010-2023 Ulf Benjaminsson.
Copyright (C) 2023-Present PandaboxWP LLC.
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation; either version 2 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA
