A better lightbox for NextGen Gallery

NextGen has been my go-to gallery for WordPress for quite a long time. Very easy to use for my clients, and super-easy to customize. But the included lightbox scripts are not so great-looking.

I recently started using Easy FancyBox to replace those scripts. If you go to Options > Effects under NextGen and select ‘none’ for the JS Thumbnail effect, you can then tweak Easy FancyBox under Settings > Media. It looks great right out of the box (so to speak) and has some nice options for fades and titles.

Here’s an example of NextGen with Easy FancyBox from a recent project.

22 comments

  1. Hi Debbie –

    Thanks for posting about this plugin.

    I had been using “Effects for NextGen Gallery” plugin, but that appears to now be dead project. Found your entry here when searching for a replacement.

    This Easy FancyBox plugin is “easy” and just “fancy” enough for what I need. πŸ™‚

  2. Hey, I’m having trouble making it work, the problem seems to be on Easy Fancybox, do you know if I have to add manually the jquery for it to work? I’m using wordpress 3.3.1, NextGen 1.9.3 and Easy Fancybox 1.3.4.9

  3. You’re welcome.

    I did find a conflict with ES Audio Player on a client’s site yesterday; the MediaElementsJS plugin works fine though.

  4. It’s working fine for me on a number of live sites. Did you go to NextGen > Options > Effects and select β€˜none’ for the JS Thumbnail effect?

  5. Hi, I have same problem as Tom. I have set NextGen -> Options -> Effects to None but Easy Fancybox doesn’t start working.

    I’m not sure what kind of settings I should have in Easy Fancybox? Now when I click a thumbnail it doesn’t open anything. Only a grey area over the whole screen and a small white box in the left corner. Withtout the Fancybox the NextGen Gallery works fine by itself.

    Could you Debbie list all your settings from Fancybox settings?

  6. I’m having major problems with this site since upgrading to 3.5 today, in a couple of days I’ll try to put a sample gallery here and post the settings for NextGen and Fancybox. I can’t even respond to comments at the moment except on the frontend nor see NextGen in the backend. The settings I have now may not be working, but I can’t activate a gallery to check.

  7. Sorry for the delay, it’s been incredibly busy.

    I just set up NextGen with Easy FancyBox on a new site running 3.5:
    http://www.hixon-interiors.com/commercial-gallery/

    Here are the FancyBox settings I’m using on this site:

    • Enable Fancybox only for images and inline content
    • Links: Exclude none, Auto-open for link with ID “fancybox-auto”
    • Overlay: Show overlay around content is ticked
    • Window: all defaults here, only the three Behavior checkboxes are ticked
    • Images & Inline Content: Auto-detect jpg gif png, Apply to all image links, Auto-gallery all in one gallery, Sections are article, div, hentry, Transition In Elastic Linear, Transition Out Elastic Swing, Show title is off
  8. I was having the same problem as Kirsi.

    I looked at OPs settings and it turns out the transitions might be what are wrong. Mine were set to ‘Back’. I changed them to swing and everything worked.

    Just wanted to let everyone know. πŸ˜€

  9. Hello,

    I followed the instructions that Debbie has suggested for WordPress 3.5, but there is still absolutely no difference. I tried to figure out what OPs settings mean, but not much success there…

    Any help will be greatly appreciated!!!!

  10. OPs is NextGen options, I think. I’m sorry you’re having such a problem. Maybe if you tell us what settings you’re using for Easy FancyBox and NextGen Options?

  11. I also had problems with the lightbox not showing. I had this setting wrong: “Gallery: Options: Gallery: Show ImageBrowser” – this must be UNTICKED or it will stop all effects. Obvious really, but I’d forgotten I’d ticked that when I tested the settings.

  12. Hey thanks a million for this tip!!

    There are sooo many complicated tutorials on integrating fancybox 2.0 with NGG and most of them are long winded and often don’t work.

    This is such a simple way to make NGG look waaaaay better than stock standard.

    Really appreciate you taking the time to post this… thanks!!!

    B

  13. I found the answer here – https://wordpress.org/plugins/easy-fancybox/faq/

    Can NextGEN Gallery work with Easy FancyBox ?
    NetxGEN has its own built in FancyBox version along with a choice of other lightbox scripts but if you prefer to use Easy FancyBox (because of better customisability) then you need to take some steps to make the two plugins compatible.

    Go to your Settings > Media admin page and switch OFF the FancyBox “Auto-gallery” option in the Images section;
    Go to Gallery > Other Options and set the Lightbox Effects option to “Custom” and click on Show Advanced Settings;
    fill the Code field with

    class=”fancybox” rel=”%GALLERY_NAME%”

    Leave the other fields empty and save your settings.

Leave a Reply

Your email address will not be published. Required fields are marked *