Description:
jQuery Lightbox For Native Galleries makes the native WordPress galleries use a lightbox script called ColorBox to display the fullsize images.
Demo:
To create the below gallery, all I’ve done is inserted [gallery] into this Page’s content. No modifications are required to get the Lightbox working.
Note however that my site uses just one of the 5 lightbox design presets. You can see demos of the other 4 at the Colorbox homepage. Just click on the demonstration buttons on the left side.
Images by Microsoft
Download:






Jessi Hance on February 1st, 2009 at 3:36 PM wrote:
It uses the “Title” field. Fill that in and that text will show up rather than the filename.
Viper007Bond on February 6th, 2009 at 2:37 AM wrote:
It uses the “Title” field. Fill that in and that text will show up rather than the filename.[/quote]
Fantabulous!!! Thank you!
[...] jQuery Lightbox For Native Galleries WP Plugin [...]
[...] jQuery Lightbox For Native Galleries WP Plugin [...]
[...] Demo: Ver demo. [...]
Falcon33 on January 27th, 2009 at 8:15 AM wrote:
Just add this into your css code and it should be fine.
#lightbox-overlay-text-about {display:none !important;
}
Doesn’t work with the latest WP release
Nico
Nico on April 4th, 2009 at 5:35 PM wrote:
I’m 99.9% sure it does work with WordPress 2.7.1. I’d test, but my blog is running WordPress 2.8.
If it doesn’t work at first, make sure you have
in your themes header.php file. Noticed this is needed as it worked in the default theme, but not my customized theme.[...] jQuery Lightbox For Native Galleries [...]
not working with FF3 on osx. works with safari no problem. any thoughts why its not working in ff3? thanks
all working fine but how do I change options? specifically opacity — I can see the spec in my style inspector (0.9) but “opacity”is nowhere on the CSS… thanks
Matthew Ginop on April 9th, 2009 at 2:30 PM wrote:
Make sure we have what in our header.php file??? (code block didn’t fill in) I am also running 2.7.1
Jeff on April 22nd, 2009 at 2:36 PM wrote:
Make sure we have what in our header.php file??? (code block didn’t fill in) I am also running 2.7.1[/quote]
<?php wp_head(); ?>Mircea on September 8th, 2008 at 11:39 AM wrote:
Ok ! For thowse who use Revolution Themes, or centred web site’s here is the solution at the “left align problem” :
In jquery.lightbox.packed.css find: html,body{margin:0;padding:0;height:100%}
and remove margin:0;
This will do the job. Tested in IE & Firefox.
Good luck.[/quote]
THIS IS A GREAT SOLUTION! I WAS FACING THE LEFT ALIGN PROBLEM, AND YOUR SOLUTION SOLVED IT, SAVED ME FROM A LOT OF PROBLEMS… THANKS A LOT….
[...] jQuery Lightbox For Native Galleries Makes the native WordPress galleries introduced in WordPress 2.5 use jQuery Lightbox by balupton to display the fullsize images. By Viper007Bond. [...]
thanks for the left-align solution!
This plugin is gonna receive a recode and a Lightbox script switch soon. Stay tuned.
Viper007Bond on June 11th, 2009 at 1:22 AM wrote:
Ended up redoing it already. Should work a lot better now.
hi, I’m soo happy with your script, it looks great.. the recode and script switch are definitely for the better, thank you so much! I do have a little question though. before I upgraded to the new plugin, the pop-up would keep the photos all to the same size (within my screen resolution, which is 1024×768). Now though, it seems like it directly grabs the original file in the original size – resulting in some photos showing with a width of 1500px. is there any way (other than to resize the original file) to put a limit to the width or height the pop-up images can go? thanks in advance!!!! (I would re-upload some of my photos in smaller sizes if there was no way to do otherwise, but I was just hoping there’d be a hidden trick…)
It never occurred to me to check until after I released the new version. I have two very large monitors (1920×1200), so I never noticed that this new script didn’t resize.
I may have to go with yet another lightbox script as I looked and there doesn’t appear to be a way to tell it to resize.
Viper007Bond on June 11th, 2009 at 2:08 PM wrote:
Ended up redoing it already. Should work a lot better now.[/quote]
What, exactly, was wrong with 1.1.0? It worked great and re-sized. AFAIK, it wasn’t broken. 2.0.0 doesn’t fire (at least on 2.7.1 Mu) so the image just loads in a blank page as if the plugin wasn’t there. Got any way to turn off the “there’s a new version” flag, so I don’t have to keep ignoring it?
BJ Johnson on June 12th, 2009 at 2:37 PM wrote:
The lightbox may have not been compatible with the version of jQuery bundled in WordPress 2.8. I’m not 100% sure, I just know that the lightbox stopped working on my blog a few months ago (I’ve been running 2.8 here for months).
I also didn’t like that it spammed you with the author of the script in the upper-right of the page. Ideally I want one that works exactly like the current one, but that resizes large images (I thought it did, but was wrong).
Hi concerning the last few comments….
version 1.1.0 worked better for me . I liked the resizing of images and also when you scroll down the page the image stays centred on the page.
The only thing I didnt like was the “it spammed you with the author of the script in the upper-right of the page.”
And your right the old version doesnt work with WP 2.8.
So for the time being Im sticking with WP 2.7.1 and the plugin 1.1.0
Any chance of updating in the future
Great plug in by the way
cheers
Dan
Does your plugin work with the K2 theme? I set it up on my blog and I tried it out but I don’t have any lightbox effects. Is there anything I need to do to get this to work or am I just out of luck?
Michael Romero on June 15th, 2009 at 8:30 AM wrote:
Nope. It loads posts via AJAX, after my plugin applies the Lightbox.
It’s likely possible to get it working, but I have no experience with K2.
Hi !
Thanks for your great plugin.
But i have one problem.
I installed the current release 2.0.0 of your plugin with wordpress 2.8
With Firefox and IE8 everything works fine. But with IE7 (Win XP SP3) i got a java-script-error and the image displayed in a seperate window.
Any Ideas.
Ralf Fuhrmann on June 16th, 2009 at 1:52 PM wrote:
Well what’s the error?
Hi !
I got a javascript error :
Code : 0
Line : 88
Char : 5
Desc : Identifier, string or number expected
Any updates yet for WP 2.8 and 2.0 of this plugin per chance? Thanks for the hard-work. If any, any temporary solution? TIA
Hmmm… is there a way to get the same behavior pre-2.0 in WP 2.8 were clicking on a thumbnail or an image (w/ rel=”lightbox”) would show a lightbox that is proportional to the viewport? TIA
Sherwin Techico on June 26th, 2009 at 5:37 PM wrote:
I don’t believe that lightbox script is compatible with the version of jQuery included in WordPress 2.8.
Old was Balupton yah? http://www.balupton.com/sandbox/jquery_lightbox_bal/demo/
The demo seems to be using 1.3.2 as well.
So I got this setup, looks great in Firefox. Testing in IE 8 and when I click on a picture it just takes me to the picture URL.
Currently I’m testing on my computer using xampp and WP 2.8
Here’s the error:
Webpage error details
User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727)
Timestamp: Mon, 6 Jul 2009 20:36:58 UTC
Message: Expected identifier, string or number
Line: 34
Char: 4
Code: 0
URI: http://localhost/wordpress/test/
I’m hoping you have a fix? Or if not I guess maybe I can use an older version?
I changed the code in jquery-lightbox-for-native-galleries.php file to fix this “Expected identifier, string or number” bug:
Line 40 had an extra comma at the end. See this post on IE Javascript errors: http://cow.neondragon.net/index.php/1404-Internet-Explorer-Javascript-Errors.
Maybe a “bug” fix in next release? (Though it’s really MS bug … I guess we still want to support that, huh?)
I’m not a coder – just now getting into designing websites and such. Are you telling me I can edit the code (looks like just remove a comma) and it will work? The majority of people that visit the site in question use IE, so it is an issue for me. Thanks!
@Viper: I know you’re busy moving and all, but any luck w/ the JS script you wanted to use? Anyways, just wondering. Have a good one. Thanks for contributing this plugin (just hope it works again pre-2.8)
Sherwin Techico on July 21st, 2009 at 3:16 PM wrote:
Sorry, but I don’t work to support old versions of WordPress. If it happens to work, so be it, but there’s no reason not to upgrade.
Sorry, forgot a word… “just hope it works again like pre-2.8″ =)
Hi,
First, thank you for this excellent and simple to use plugin.
It seems that I have an issue under IE, using it with a fixed width theme (just a quick conclusion for a bit of googling : http://www.cssquirrel.com/2009/04/24/correcting-overlay-issues-with-jquery-lightbox-and-fixed-body-width/)
Under FF the plugin just working great, but under IE the black overlay just stop before covering 100% of the width. Any Idea on how to fix that ?
PS : can see example on any of galleries inserted in my blog : http://www.ange-studio.com
Hi, thanks for creating something that’s so simple to teach an impatient blogger to use.
I’ve patched the plugin to use the ‘large’ size image generated by WordPress. This seemed the most appropriate size, and it can be of course customized in the Configuration interface if it’s too large. Medium, as suggested above, was just too small for a lightbox.
You can download either a diff of the changes or a the full php file with changes from http://www.ross-williams.net/wp-jquery-lightbox-patch/.
See the plugin in action here.
great job!
[...] jQuery Lightbox For Native Galleries [...]
Hey!
Thanks for this great ans very small (javascript) plug-in!
I would like to see the description or the title at the bottom of the full sized picture. I mean this descriptions under the thumbnails:
http://www.tom-feddern.de/2009/09/05/bilder-nr-2-diesesmal-von-dem-haus-in-dem-ich-wohne/
Thanks,
Tim
how can i exclude some images from the gallery. e.g: i have 10 images in my post uploads gallery. but i want to show only 6. how can i exclude 4 that i wont use? thanks.
marujo on September 22nd, 2009 at 8:31 AM wrote:
My plugin uses the build in gallery feature: http://codex.wordpress.org/Gallery_Shortcode
I don’t believe that is possible.
umm is there a way where it can automatically scale an image down to a certain limit?
Kevin on September 29th, 2009 at 1:41 PM wrote:
It doesn’t seem like it.
I need to find (yet another) jQuery-powered lightbox script probably.
I am pretty new to WordPress and have pretty much no programming skills. That being said, I have been working on getting a WordPress blog up and running and it’s been going very well. I installed your plug-in and very much like the way it works. I have one question about it however that I’m hoping someone might be able to help me out with. I am wondering if there is a way to display only a single thumbnail in my gallery post instead of all of them? I’d like the entire gallery to be displayed when someone clicks on the thumbnail. Is this do-able? I have seen a couple “hacks” online but they are honestly a bit intimidating to me.
Thanks in advance.
[...] Check out live demo [...]
[...] [...]
Is there a way to make this plugin work with Highslide? I’ve got all the highslide files installed but really just need a plugin to automatically add the code to each image in a gallery. There are plenty of single image highslide plugins but i’ve yet to find a gallery one.
Cheers,
Tim
Is there a way to have the Medium or Large image sizes show up instead of the Fullsize image? This would be especially useful as this script does not resize the images to fit the users screen.
Thanks,
Tim
Looks like we figured out how to use medium sized images. Adjusting line 49 onwards in “jquery-lightbox-for-native-galleries.php to this fixes it:
// Make the thumbnails link to the fullsize image rather than a Page with the medium sized image
function attachment_link( $link, $id ) {
$post = get_post( $id );
$image = wp_get_attachment_image_src($id, 'medium');
if ( 'image/' == substr( $post->post_mime_type, 0, 6 ) )
return $image[0];
else
return $link;
}
Could you please addapt your code modification to the latest version of jQuery Lightbox for Native Galleries? Thanks!
Tim on October 17th, 2009 at 8:59 AM wrote:
I have no idea what Highslide is, and I don’t provide support for modifying my plugins. You’re on your own if you wish to do so.
[...] that’s a different subject for later on. For now I have updated my Portfolio. I added a new plug-in today to make the pictures look nicer and pop-up when you click on them to show the expanded [...]
I like your plugin but I could not use it while it displayed full size images. I rewrote this a bit to allow you to choose which size image to display in the lightbox window. To do this I used the wp_get_attachment_image_src() function like this.
// Make the thumbnails link to the fullsize image rather than a Page with the medium sized image
function attachment_link( $link, $id ) {
$post = get_post( $id );
if ( 'image/' == substr( $post->post_mime_type, 0, 6 ) ) {
// return wp_get_attachment_url( $id );
$image = wp_get_attachment_image_src( $id , 'large');
return $image[0];
} else
return $link;
}
You change the ‘large’ to any one of the following (thumbnail, medium, large or full) depending on what you would like it to show. Perhaps this could be turned into an option for the plugin that people could choose.
Thank for the plugin.
[...] jQuery Lightbox for Native Galleries [...]
[...] jQuery Lightbox for Native Galleries [...]
how i can continue using the simple lightbox? i prefer… it is possible? thanks.
marujo on November 2nd, 2009 at 6:54 PM wrote:
Use an old version: http://wordpress.org/extend/plugins/jquery-lightbox-for-native-galleries/download/ (You probably want 2.x)
Note that old versions of my plugin are not supported and may contain bugs (for example, 2.x did not make very large images fit on the user’s screen)
Thanks for your plugin!
Plugin updated to allow you to pick from five preset themes.
Hey there, thanks for your great work!
I had trouble getting your plugin to work – following the installation guide at first no colorbox / lightbox effect was visible, however other jquery scripts were working fine. I realized that no reference to the colorbox.css and the jquery.colorbox-min.js was included in my head – after copying them from the plugin.php and inserting them into my head manually everything worked fine though.
I don’t really know why this part of your plugin doesn’t work (at least not for my theme – can this be a theme specific error?), I could only guess that this has something to do with the wp_head call in the plugin.php – however, I am far from being an expert and not really sure whats going on here. But perhaps you have any idea as to whats going on here
Also, for those trying to get this plugin work for single images, change the code from the comments above to the following:
//
This worked fine for me.
Again, thanks for your efforts,
- Philipp
Another try for the updated single image js:
//
I give up, dont know how to insert code, sorry =)
Hi Ph, any chance that you can share your solution with us within the tag?
Wrap it in [code] tags, or [html] or [javascript] or [whatever].
And I have no idea why it’s not working for you.
Fantastic plugin, but I have a problem. I’m getting a lot of 404 errors. They appeared after updating your plugin. This are the URLs getting the errors.
myweb.com/category/images/internet_explorer/borderMiddleLeft.png
myweb.com/category/images/internet_explorer/borderBottomLeft.png
and so on…
I searched and your plugin has a folder called “internet_explorer” with those images inside. What could be causing this?
I know what’s wrong. I’ll see if I can fix it.
hi. im using this new version. it works, but the navigation between the images doesnt work for me. the arows, and the click on sides of images dont works. so i need to click 1 by 1. how can i enable the nav between the images of [gallery]. im using the lightbox2 plugin (m3nt0r.de/blog/) to show the single images. it can bug the jquery l4ng? thanks a lot!! this plugin i very useful.
ps: in the WP 2.9 the gallery accepts the exclude and include ids, like [gallery exclude="23, 31, 44"]. so, it works well with this new update?
other question: how i can translate the words “close”… and ‘next’, ‘previous’, etc? tks!!
Thanks, I’ll be checking for an update. Thanks again.
Hi,
I’d like to remove or hide the text in the bottom left corner that displays “image 3 of 23″ for example, so that the only text on the bottom is the caption. How could I do this? Thanks!
The whole lightbox style is created using CSS and you can just use CSS to hide that:
#cboxCurrent { display: none; }the plugin has some bugs, but bugs are good “that needs fixing? SWF files or videos, make the plugin does not work properly, for example youtube videos are put on the photos it does, it can not be placed near the photo gallery for a video that failure is not displayed correctly The YouTube video is placed on top …
vercion former did not have this plug-ERROR,
example:
http://www.mujeresfatales.com/mf/7939/
Clicking on the first image in the gallery and see my error, please solution since the old vercion of this plugin if working properly …
Thanks for the great plugin. At first the navigation was working, but since a few weeks the arrows have disappeared. I think it’s the same problem marujo is experiencing.
Any ideas how to fix this?
About my question above – hiding the “image X of X” – where exactly do I put that CSS code? I’ve tried implementing it into my full css file and can’t get it to work. Thanks!
Adding this to the bottom of my theme’s
style.cssfile worked for me:#cboxCurrent { display: none !important; }Yep, that did it! Thanks a ton!
hi. the nav between images ( X to X) continous doensnt work for me. i already add this line of css in my style.css and nothing change. any idea? thanks!
Thanks for this great plugin, the change to Colorbox is really a plus for us.
To help with the localization of the plugin would you consider adding in the admin section the ability to modify some of the parameters of Colorbox ?
(for the controls)
current, previous, next, close
And maybe allow the use of the slideshow mode ?
(for the slideshow)
slideshow, slideshowAuto, slideshowSpeed, slideshowStart, slideshowStop
Thanks !
I completely forgot about that. Yes, I’ll add support in the next version.
please, see the bug with the navigation between the images. i use the css ‘#cboxCurrent { display: none !important; } ‘ but doenst work for me. and this function, to click on laterals to navigate between images, is very practice/important. if have another way to fix this, please post. thanks a lot!
ok!! now it works for me! i dont know why/how, but i add the css
#cboxCurrent { display: none !important; }
in the bottom of my style.css and now it works. perfect!!
the slideshow option and exclude itens will set this plugin completely (and translate text/buttons). thanks a lot!
other sugestion: add this function not only to [gallery] shortcode. its interessant to extend this to single images in a post, that contains a link to image. thanks a lot!!
Hello, this seems like a great plug in, though it doesnt work on my website.
(Of course I activated the plugin)
I have a custom designed template.
Suggestions are most welcome!
[...] jQuery Lightbox by Viper007Bond helps to keep your pages short and sweet to avoid lots of scrolling by your visitors. It also does [...]
This plugin worked great on my client’s site. You can see the gallery I setup (with your help) here: http://www.hudsonvalleybarnhouse.com/the-space/
Thanks for a great plugin!
How can I put a banner under or over the image? Is it possible?
Hi, great plugin, thanks so much. Replaced the colorBox with the latest version (1.3.4) and it works great!
I’m just wondering if there’s any way to ditch the jQuery include as I’m already using it on my site. I can’t figure it out, with my rubbish PHP skills!
Many thanks!
If you need jQuery in your theme, you should be loading it by adding this to your theme’s
functions.phpfile:The script API was designed to avoid exactly this (multiple copies being loaded, etc.).
Ah, much better! I’m a WordPress noob, so all assistance is greatly appreciated!
Many thanks – also for the excellent plugin!
Richard
Oh, I figured it out!
Changed line 33 of jquery-lightbox-for-native-galleries.php from:
wp_enqueue_script( 'colorbox', plugins_url( 'colorbox/jquery.colorbox-min.js', __FILE__ ), array( 'jquery' ), '1.3.3' );
to
wp_enqueue_script( 'colorbox', plugins_url( 'colorbox/jquery.colorbox-min.js', __FILE__ ), array(), '1.3.3' );[...] We have found a Lightbox plugin for this WordPress Gallery code as well. You can get the plugin here. We have been very pleased with this plug-in as it gives your site that extra needed level of [...]
Hello,
I just want to know if the new version solves the bug I posted on the comment 154 (#comment-228909)
thanks
Oh good! I was going to fix that myself, but I guess the author beat me to it with their new version of Colorbox.
Yeah! Thanks
Just a quick comment to thank you for such a nice uncluttered and simple plugin. I’ve used others that just get to bloated with each update. Great work.
One thing I would like to see tough are visable arrows at the edges of the screen to provide a navigational option for visitors to click through the images.
I;m using the plugin on my blog if anyone is keen to see it in action with some sweet photos
http://www.paulpetch.com/2009/12/07/2009-kepler-challenge-photographs/comment-page-1/#comment-7027
There are various themes available and I believe one of them is like that.
If not, the entire thing is skinnable (as proven by the bundled 5 themes which are completely different in design). Just make your own that fits your needs.
I may sound stupid, but I read all the things and well, I’m newbie…
I know how to use the shortcode [gallery] but how I upload the images and group it on a gallery?
This was written for WordPress.com, but the process is mostly the same:
http://en.support.wordpress.com/images/gallery/
Solamente felicitarlos por el Plugin para WP, muy sencillo de instalar y configurar.
Muchas gracias,
Guillermo Leon
seisiho.edu.pe
Arequipa, Perú
Me again!! It seems that the bug I reported on the comment 154 was not fixed.
Man I hate IE.
[...] del Creador Viper007bond Descargar desde WP jQuery Lightbox [...]
[...] jQuery Lightbox For Native Galleries [...]
I have a wordpress page called ‘Photos* where i intend to put two or three different galleries (since it’s for a band the galleries will consist of live, press and other pictures ). I’ve downloaded the plugin, unzipped it, uploaded it to the plugins-directory and enabled the plugin in WP-settings. Problem is nothing’s changed. When I click the thumbnails I get the full picture URL, and not the fancy lightbox of the same picture I wished to see. Is there something I’m missing? Does it have anything to do with the fact that I’m using my own wp-theme?
Nevermind my question above; after some digging in the comments I found that I had removed the
-code from my header-template, and therefore never got the jquery-code printed out. Problem solved, and thank you for a neat and stylish sollution!