Support » Plugins and Hacks » Lightbox JS Plugin

Lightbox JS Plugin

  • Hi all.. just made a new plugin, i have disabled comments on pages at my blog so here goes the content:

    Plugin that turns posted images into neat Javascript-powered overlay popups instead of just linking to the fullsize image. This plugin is based on the cool javascript done by Lokesh Dhakar and transformed by to a plugin for WordPress by me, inspired by Frank from 2d-sign. Enjoy!

    What is it good for?
    It scans your posts for linked images and makes a nice overlay popup out of them. This is much better then linking to a new window oder even open a fullblown javascript popup. This is a neat little thing and shows a small preloader animation before showing the full image. Before i continue to talk about what it is, i better put on some example.

    Example Linked Image
    (( check out at my blog ))

    How to Install?
    1. Just download the zip-file and unpack it into your wordpress plugins-folder.
    2. There is only one thing you need to take care of: Open the “lightbox.js? and change the absolute path to the loading image and close image. If you don’t do this, then you will get an javascript error and your computer explodes into a million pieces, but then again.. nothin but nothin will happen. So better watch out for this path if you use permalinks. Defaults to “/blog/? ..
    3. Activate it and you’re done. Browse to a post of yours with an linked image to see if it’s working.

    Click here to download version 0.1 (zip)

Viewing 15 replies - 1 through 15 (of 45 total)
  • I use the Zap_ImgPop plugin. Could you contrast yours and his?
    Thanks, jim


    I just tried Zaps over on his blog and it gave me an Javascript Error and also it just looked like a normal linked image. With my plugin you have no errors and also it looks smooth (centered, with border and closebutton, while background blurs) and you dont have to write anything into your image-tag by hand.

    The plugin i wrote “scans” for linked images in your posts and applies its magic to them. Furthermore it can have “captions” which are based on the image title-attribute and it is compatible with any image upload script you might use on your blog including the one from WP2.0.

    To have popups like this you dont need any html skills at all and the script is very light written. nearly no overhead and the necessary HTML for the popup is madeup clientside with some DOM-Magic.

    I am really not into the Zap_ImgPop and only went to developers blog to see his demo and as far as i can say Lightbox is easier to use and better looking. If there are any styling options or even an adminpanel on Zap_ImgPop i have to say that you will miss a configuration panel on the wp-lightbox, even though i think you really won’t need any. If you want to change something then exchange the images provided or tweak the CSS.

    It is completly dynamic and compatible to all major browsers.

    EDIT: i just tried Zaps again and seen it in full effect. Looks like the error only appears on first visit. However.. there is one error. His looks cool too and is draggable.. It is hard to contrast them now except for that error. I like his too. Cant tell. The Lightbox PopUp is pretty much straight forward compared.

    I had same kind of error at your site: the plugin didn’t work on first visit. The page just became dark-coloured but no error was given. However, it worked when I returned to your site.

    I’m using Opera 8.51 and Mandrakelinux 10.1.

    YES !!!
    That is such a great work, many thanks !

    It only works for me if I hardcode the <a rel=”lightbox” href=”http:XXX into my post.

    I assumed the plugin was a wrapper that would insert it automaticaly for me ?

    If that’s indeed the case then something wrong somewhere as it does not work without manualy inserting the tag.



    This seems great! BUT…i cant get it to work on my site…I can see by the source view that it adds the js…but…it’s not loading the image in the new window still…

    *sigh* should we add the rel tag in the img tag or the link tag?

    there is now a version 0.2 available, checking if an image is linked or if it is a link to a normal website.

    the plugin adds the rel automatically.. it,s like.. you drop it in and it works. theres not much to it. it should work straight away.

    if you have trouble, post your website and ill check what the problem could be. actually i couldnt think of anything. i am just matching and replacing .. :/


    Here is my checklist:

    – begins with A,
    – has href,
    – last part of link ends with an image extension,
    – IMG follows the closing A-tag

    If all is okay:
    -> append “rel=lightbox” to the end of the A-tag.

    thats it… it must work, if not .. there is something in the HTML written where my pattern fails upon OR there are errors within other Javascripts OR you havent setup the path-vars within the lightbox.js

    hope that helps..

    still no luck, still http://killerfrog.demon.nl/blog

    I assume the path-vars is not the issue as it works when I hard code the lightbox in the tag


    the latest entry cant be found by my script because there is a space between the link an the image-tag

    ...> <img ..

    that’s very uncommon and so i don’t check for things like that. maybe that’s the issue? as for the other pictures i can hardly tell what is working and what’s not. the other ones look good and should be replaced properly.

    This is a very cool plugin; however, I can’t for the life of me get it working. I’ve got a thumbnail linked to the full image and the plugin is activated. I’ve even tried adding the rel=”lightbox” but no avail. Any ideas?

    My blog

    Or take a look at this post in particular. Thanks

    Ah, nevermind. I followed the instructions and downloaded the version on this site and it’s working fine. Thanks anyway

    Would love to get this plugin to work on my blog. According to my instructions there is no need to add tags. It will just convert all links as needed. Some people discussed the rel tag, I tried adding that as a test and it still didn’t work.

    I look at the code for my links and none of them have a rel tag. Does the plugin insert these tags? I did contact the author also.

    It does automatic. The reason why it isn’t working at your site is because it tries to look te plugine in “motorcycleramblings.com/wp-content/…” instead of “motorcycleramblings.com/blog/wp-content/…”. Maybe something is wrong in your wordpress settings (weblog address ?)

    My blog address is different from my wordpress address b/c I installed wp in a subdirectory. Wouldn’t the plug recognize this basic setting or am I missing something?

    Thanks for the help.

    In your WordPress options you can define 2 URIs. One for wordpress and one for the blog. For the WordPress URI you should use “motorcycleramblings.com/blog/” because there is your wordpress installation (right?). The other URI should be “motorcycleramblings.com/”, I think…

Viewing 15 replies - 1 through 15 (of 45 total)
  • The topic ‘Lightbox JS Plugin’ is closed to new replies.