WP Featherlight: A New Lightbox Plugin for WordPress Images and Galleries

photo credit: neverland... - (license)
photo credit: neverland…(license)

WP Site Care recently launched its new WP Featherlight plugin on WordPress.org. While there are already hundreds of lightbox plugins available for WordPress, this one may prove to be the “lightest” of them all.

The plugin is essentially a wrapper for the Featherlight jQuery lightbox script created by Noel Bossart. Featherlight.js was designed to be very lightweight and is just 400 lines of JavaScript, 100 of CSS, and less than 6kB combined. It works on IE8+, all modern browsers, and on mobile platforms. The script is responsive and supports images, ajax, and iframes out of the box.

WP Featherlight solves a number of problems that WordPress users often encounter with lightbox plugins, many of which contain a load of heavy-handed styling that is difficult to override.

“We were having a really hard time finding a lightbox plugin that was simple to customize, but that was also lightweight, flexible, and didn’t add a bunch of bloat to our website,” WP Site Care founder Ryan Sullivan said in his post introducing the plugin.

The WP Site Care team opted to build their own solution on top of Featherlight.js. The resulting plugin provides a fast, minimalist style popup for images and galleries.

wp-featherlight-screenshot

The plugin includes built-in support for native WordPress galleries and Jetpack galleries. When you install it, there are no options to configure. It will automatically display all images and galleries in a lightbox. If you add some extra data attributes to your content, it’s also possible to display videos, iframes, and ajax content with WP Featherlight.

The demo video below shows how the plugin works with galleries to click from one image to the next while in the lightbox.

One common problem with WordPress lightbox plugins is that they usually load their scripts and styles on every page, whether you need the lightbox there or not. WP Featherlight gives you the option in the post editor to disable the lightbox. It’s a handy option to have in case you don’t want to load a larger version of your images on that particular post/page, but I’m not sure why you wouldn’t just conditionally load the scripts on pages that have images.

I tested WP Featherlight on a demo site and found that it works as advertised. You would be hard pressed to find a leaner lightbox plugin for WordPress. The style is super minimal and the fact that there are no options to configure makes it a pleasure to use. Many thanks to Robert Neu and the folks at WP Site Care for making it freely available on WordPress.org.

19 Comments


  1. Great job. I had always hard time to find something lightweight for handling pictures on sites. This one is exactly piece what I was looking for.

    Report


  2. Will it work with woocommerce ? Default woocommerce lightbox is really slow on many sites…

    Report


      1. Just tried. Seems not working without modifications. Will look forward for light image popup plugins …

        Report


  3. Does it work on featured image?

    Report


  4. I was using Featherlight for a couple of my projects and found it very useful. Having a WordPress plugin version is a good time-saver. Thanks for sharing!

    Report


  5. Great plugin and so good to see a video that runs you through how to use it.

    I second what Sarah said:

    “Many thanks to Robert Neu and the folks at WP Site Care for making it freely available on WordPress.org.”

    Report


  6. Awesome plugin. I’ve tried a ton of these things and they all seem complicated and weird. Props to the WPSitecare team for this one

    Report


  7. I tried this plug-in and tried it immediately on an iPad, but….. the next previous buttons don’t work (Google Chrome on iPad). So i had to disable it again. Mobile first!

    Report


    1. Hey Patrick,

      By default, WP Featherlight uses gestures on mobile devices. If you swipe left or swipe right you can advance the images in your gallery. If you run into any issues with that, let us know!

      Report


      1. You are right! Tnx for replying. Still think there should be a little arrow to indicate however

        Report


      2. Hey Patrick,

        Sorry you found it confusing. I’ll do some more mobile device testing and see if we can come up with a way to indicate the swipe functionality on touch-enabled devices.

        Report


  8. Looks like I missed this post somehow. Thanks for the writeup Sarah! We have a small update coming later this week to fix some edge case issues with caching plugins and update the Featherlight script to the latest version.

    If anyone finds any bugs or has issues of any kind, please let us know! We want WP Featherlight to work for as many situations as possible. :)

    Report


    1. Hey Rob, great plugin. When I click on your gallery examples here http://noelboss.github.io/featherlight/gallery.html on my phone (iphone 6) I don’t get gestures at all— just tiny little left/right arrows. You say gestures are on by default? Am I missing something?
      Many thanks!

      Report


    2. Rob, is there a way to zoom in at all? I have an issue where if an image is in portrait mode, I can’t zoom in and read it.. If you click on the image here and make the screen small like on a mobile device, or just a small macbook air, I can’t zoom in anyway to read the text. Is there an easy fix for that?

      Report


  9. Just installed this and tested it. The lightbox works great. Would like to see support for WP Featured Image!

    Report


  10. I’ve installed the plugin and am testing it on my laptop. No arrow icons to browse to the next/prev images in a gallery. Keyboard keys not working either so I’m stuck on the same images. Any idea why?

    Also it doesn’t display captions/descriptions/alt texts as captions. As this aspect isn’t covered in the video I was wondering if it’s on purpose or if there’s something extra to do in order to display captions.

    Thanks!

    Report

Comments are closed.