z-Lightview

Current Version: z-Lightview Plugin 1.3.0

This plugin will replace the WordPress 2.5+ gallery shortcode with code that utilizes Nick Stakenburg’s Lightview. A clean, simple JavaScript image and gallery viewer.

It will automatically use the Lightview viewer for image links that point to another image. WordPress does this by default when you insert a thumbnail with a link to the full version of the picture. The plugin will also enable Lightview when using the gallery shortcode:

[ gallery ]

There should be no spaces before and after “gallery”. Small spaces were included in the above example to prevent WordPress from inserting a gallery.

Version History

1.3.0 (Sep. 16/09) – Note: As of version 1.3.0 the plugin will (by default) automatically backup installed Lightview files during updates; however, you’ll need to install these files just once more–my apologies folks, I have addressed this issue going forward to ensure you are not inconvenienced again. Updated in this version:

  • Revised filters to better determine when Lightview should be used.
  • Updated bundled Prototype library to version 1.6.1. This should provide better support for Internet Explorer 8.
  • Revised Scriptaculous library to prevent it from trying to load additional, unnecessary add-ons (previously it would cause several 404 errors).
  • Created a settings page (under the main Settings menu) to manage where and how the plugin should use Lightview.
  • Added an option to prevent Lightview from being used on images linked to from external sites (configurable in the new settings page).
  • Added an option to backup Lightview’s JavaScript, CSS, and image files during updates to the plugin (this will ensure you do not have to re-download Lightview in future updates). This is configurable in the new settings page.

1.2.1 (Jul. 26/09) – Update to support PHP 4. This should fix the line 34 syntax error that would cause a fatal error when running in a PHP 4 environment.

1.2 (Jul. 21/09) – Updated Lightview to version 2.5. Also updated Scriptaculous and Prototype JavaScript libraries. This update also better manages the inclusion of these on web pages by utilizing WordPress’ proper functions (thereby avoiding potential conflicts).

1.1.2 (Aug. 26/08) – Updates Lightview to version 2.3.1.

1.1.1 (Jun. 17/08) – First public release.

22 Comments for “z-Lightview”

  1. Jon Hassall says:

    Thanks, works great for me. This is a nice timesaving plugin.

  2. Dave says:

    You’re welcome. Glad you like it!

  3. Ryan says:

    doesn’t install with WP 2.8.2

  4. Dave says:

    I’m using it on my blog without issue. Are you getting any errors? What happens when you activate the plugin?

  5. Dave says:

    I’ve just released version 1.2.1 which fixes a fatal error issue in PHP 4.

  6. Jon Hassall says:

    Hi

    I am enjoying using this plugin for a quick LightBox popup from a thumbnail image.

    Is there a way to make it so a thumbnail image, when clicked, goes to a LightBox popup with previous and next buttons to go through all the images related to that page?

  7. Dave says:

    Hi Jon,

    So if I understand your question correctly, you would like only one thumbnail image on a blog post or page, and that would in turn open Lightview with the gallery options (Next/Prev image, and Play/Stop slideshow).

    Lightview uses the class declaration to identify links it should intercept. To group multiple links into a single slideshow, you need to also declare a rel statement in all the links you want associated.

    My plugin takes care of this for you within certain conditions. It handles all links that point to JPEG, GIF, or PNG images. This includes both text and image links. So if you want a thumbnail to engage Lightview, just put the thumbnail in a post and use it as a link to the full-sized image.

    To create the slideshow, the plugin uses WordPress’ built-in gallery system (more or less) and adds that “rel” tag I mentioned earlier. If you wanted to not use the built-in gallery, but have a single thumbnail that links to multiple images, you’d need to manually, somewhere put links to all those images on that post and add the “rel” tag.

    It’s a bit difficult to explain but easier to understand if you see a working example. Take a look at one of my posts where I use the gallery. View the source code and you’ll see how it’s structured. It’s using the WordPress gallery, which is not exactly what you’re going for, but the source code would be very similar.

    Also take a look at Nick Stakenburg’s web site (click the “How to use” link on the left), he has some really excellent examples.

    I suppose you could put the WordPress gallery in your post, then in the post editor click the HTML tab and enclose the gallery in a div bracket with a style element to not display what’s there. (Does that make sense?) This would effectively put the gallery code in your post, but prevent it from displaying in the main content area.

    It would be beneficial for me to know how comfortable you are with HTML code, so please let me know. I can be as detailed as you need. Post back with any follow up questions you may have or if you’d like me to clarify anything.

  8. Prenajom chaty na Slovensku says:

    Perfect plugin. Thanks.

  9. yaniv says:

    hi,
    this is a great plugin!
    but the corners are all upside down… and it looks like this:
    http://img80.imageshack.us/img80/4373/cornerswrong.jpg
    can you please tell me whats the problem?
    thank you
    Yaniv

  10. Dave says:

    It would be really helpful to know your web site so I can see how the page loads firsthand.

  11. yaniv says:

    Hi Dave, im building my website so its on localhost on my computer…
    is there any information i can give you so it would be easier to solve this?

    thank you,
    Yaniv

  12. Dave says:

    I’ve sent you an e-mail.

  13. Malcolm says:

    When I use this plug-in (which is great btw – thanks!) I lose the columns feature… all the pics display in one long column even if I opt for 2 or 3 columns. Is there any way around this?

  14. Dave says:

    Let me look into this and get back to you. I’m working on a new theme that exhibits the same issue so I’ll be investigating it in the next couple of days.

  15. Malcolm says:

    Thanks Dave, look forward to hearing if you can resolve this. Long skinny blogs are tiring to read ;-)

  16. Dave says:

    I haven’t tested this, but I think the solution might be related to CSS definitions. My plugin removes much of the CSS code that the original WordPress shortcode added. I did this so people (read: me) could define their own styles in their theme’s stylesheet versus having WordPress override right before the gallery is printed to the screen.

    Take a look at my stylesheet, scroll to the section entitled WP 2.5 Gallery. See if adding similar code (just change the colours to match your theme) fixes it.

    Let me know how that works. I’ll test something more when I wrap up some other projects, and possibly release an update to resolve the issue.

  17. Malcolm says:

    Thanks Dave… that seems to have fixed the problem – on Mac browsers anyway. I’ll test IE later. Much appreciated…

  18. Dave says:

    Great. I’ll look into creating an options page to let users toggle my plugin inserting that code.

    Thanks for letting me know that it worked!

  19. marujo says:

    hi, with this plugin i can insert some images in the gallery, eg:
    [gallery exclude="3,7,9"]
    because with gallery tag always load all the image sin the gallery. and i want to display only part of all. thanks!

  20. Dave says:

    The plugin does not provide any additional control or options over what WordPress provides with respect to the gallery. It only adds the necessary code to use LightView when images are called (gallery, or otherwise).

  21. Comprar vino says:

    Cai this work for an iframe in wordpress?.
    If so , how would i have to “do” the sintax and , could i set its width and height?
    Thanks in advance.

  22. Dave says:

    Yes, however, this plugin only automatically manages images at the moment. If you install and activate the plugin, it will load the necessary Lightview files on each page, which means you can create a link and have it open in an iframe. An example of how to structure that link would be as follows:

    <a href='http://www.churchmessagesonline.com' class='lightview' title="Church Messages Online:: :: fullscreen: true" id='demo_iframe' rel='iframe'>iFrame Sample</a>

    This would result in a link like: iFrame Sample.

    More documentation is available on Nick’s web site but if you have something specific in mind I can provide you with the code to get you started.

Leave a Comment