How to disable (and replace) Visual Composer lightbox

Home / WordPress / How to disable (and replace) Visual Composer lightbox

One of the reasons you might want to replace Visual Composer lightbox (it is using prettyPhoto actually) is because of the mobile view where images opened using the effect are so small that you can hardly see or scroll through them.

Several people have asked about this on official Visual Composer website, but they only gave short answers which may be difficult to grasp for whoever isn’t a programmer. In short, this is how you do it – please note that this works for versions up to 4.x.x so if this is not working for versions 5.x.x (version 5 is not yet released as of this writing, nor there are any special information about it, but just to be on the safe side), feel free to post in the comments so I could remove this article. But until then, I hope some of you will find it useful.

So this is how it goes:

First, you’ll want to put the following code into functions.php of your parent or child theme:

After you have done it, prettyPhoto is disabled. Now it’s time to pick another lightbox and this is one of the solutions I definitely recommend – Responsive Lightbox by dFactory. But given that VC adds rel=”prettyPhoto” attribute, you’ll want to set the new lightbox like this, making sure that you name the correct Selector:

That’s it!

  • Glenn Eaton

    I’ve got VC version 5.0 and the fix is not working. Love Responsive Lightbox but hate Pretty Photo. Not happy that VC force this rubbish onto the user.

    • Thank you Glenn for the info, sorry to hear that it is not working any more 🙁 But I will leave it for the time being for users who still have 4.x.x. (I guess there are still plenty of users out there).

      • Glenn Eaton

        Yes, sometimes it’s not worth upgrading. The VC makers have a plugin for purchase to overcome the problem of course!

  • pasc

    Thanks! It worked for me, but only with the swipeBox option, the others don’t work. Do you have an idea why?

    • Martynas Nobleman

      enable Custom events Enable triggering lightbox on custom jQuery events. leave event as is

  • ClearLakeWeb

    It didn’t work for me. I wonder if I did something in the wrong order? Does that matter?
    I have Visual Composer 4.12. I added the above code to the child theme’s function.php file and when that didn’t work, I added it to the function.php file of the original theme. I cleared my browser but it’s just not working. I would greatly appreciate any suggestions. Thank you for your time.

    • Could be anything, really, perhaps prettyPhoto loading from elsewhere, etc,

      • ClearLakeWeb

        I’ll keep digging. Thanks! 🙂

        • Bhargav K Naidu

          did it work anyways later? i am struck too

          • ClearLakeWeb

            If you look at my other comment above, I did get it to work when I toggled these two options: “Force gallery lightbox: Try to force lightbox for custom WP gallery replacements, like Jetpack tiled galleries.” and “Custom events: Enable triggering lightbox on custom jQuery events.”

            Here is the website I was working on: http://www.jeffriesart.com Click on Galleries.

            Hope that helps.

    • Hey, did you follow additional info about installing the plugin and setting the selector?

      • ClearLakeWeb

        I did do that and it still wasn’t working but when I toggled these two options: “Force gallery lightbox: Try to force lightbox for custom WP gallery replacements, like Jetpack tiled galleries.” and “Custom events: Enable triggering lightbox on custom jQuery events.” then it worked (not sure which one did the trick). And I did upgrade to the latest Visual Composer so I didn’t have any issues with that as another post mentioned. Thanks for asking! I guess it pays to just toggle here and there and see what happens. 🙂

  • Bara Anton Florian

    This is amazing! Thank you so much!

  • Daniel Kenzo

    I figured out a way to get it to work with Visual Composer version 5.1:
    STEP0: Do what the article above says
    STEP1: Connect to your FTP via Filezilla or other app of that kind,
    STEP2: Download and extract the archive: http://www84.zippyshare.com/v/vRCOfF3W/file.html

    STEP3: Place folder “plugins” from the archive within “wp_content” folder on your FTP, it will overwrite one Visual Composer file to enable usage of Responsive Lightbox.
    STEP4: Let me know if it worked for you too.

    My Responsive Lightbox General Settings include:
    – all checkboxes checked (excluding last 2),
    – setting loading place to ‘footer’

  • Comorv

    I got VC 5.1 and it works 🙂

    THANK YOU (I really dislike prettyPhoto)

  • Matt Herich

    Thanks so much for this! I’ve been meaning to address prettyPhoto and this was a lot easier than I expected.

  • OldManAnalog

    The latest version of RL (1.7 as of today) has a setting to attempt to force RL to override prettyPhoto for pages built with VC. The RL support people say to check the Force box (“Luke, use the force”) and it will work. But it doesn’t. I struggled with this (being a newbie) for a couple of days until I found this page and set the selector to prettyPhoto so RL can grab the call to pp and take over. No need to edit your functions.php file at all.
    So the answer to this (for me, so far) is this:
    1) Responsive Lightbox settings and enable Force lightbox option.
    2) Set “selector” to “prettyPhoto”.
    And Bob’s your uncle.
    PS: As near as I can figure, nobody likes prettyPhoto.

  • Cristian Buda

    VC 5.0.1 and VC 5.2:
    doesn’t work….

  • Pablo

    Awesome, thanks heaps!