Easy FancyBox for WordPress

Easy FancyBox for WordPress

Install now

Download Version 1.8.9

Requires WordPress: 3.3 or higher
Compatible up to: 5.0
Downloads: 2522700

Rating: 4.6 out of 5 stars
# Votes: 155

Download

Latest version: Download Easy FancyBox for WordPress 1.8.9 [zip]
Downloaded 2522700 times.

Rated 4.6 out of 5 stars with a total of 155 votes on WordPress.org »

Screenshots

  1. <p>Example image with <strong>Overlay</strong> caption. This is the default way Easy FancyBox displays images. Other options are <strong>Inside</strong> and the old <strong>Outside</strong>.</p>

    Example image with Overlay caption. This is the default way Easy FancyBox displays images. Other options are Inside and the old Outside.

  2. <p>Example of a YouTube movie in overlay.</p>

    Example of a YouTube movie in overlay.

1154 Comments

Quick followup on my request for support. I just checked again on the product pages, and the product image on every page where I see this exposed link code does not open in a fancybox, but those that were not linked from the blog post I mentioned all do open in Fancybox without any trouble. Thanks so much for any assistance you can provide!

That’s prettyPhoto light box that came with Woocommerce. Best not to use more than one light box script on a site… To make prettyPhoto work with other image links than only on the product pages, try giving a link a data-rel=”prettyPhoto” and class=”zoom” attributes.

I see, I had spaced on the fact that WooCommerce also has this feature. I’ve submitted a ticket with them and hope they can help me work it out. Thanks for the information, Ravan! It really helped me know where to turn for further assistance. Have a lovely day.

Easy FancyBox 1.5.8 – Fatal error after updating the plugin

Can not be activated, both in the individual Web and in the Multisite Web

Warning: require_once(/srv/www/[domain]/wp-content/plugins/easy-fancybox/class-easyfancybox-options.php): failed to open stream: No such file or directory in /srv/www/[domain]/wp-content/plugins/easy-fancybox/inc/class-easyfancybox.php on line 424 Fatal error: require_once(): Failed opening required ‘/srv/www/[domain]/wp-content/plugins/easy-fancybox/class-easyfancybox-options.php’ (include_path=’./:/usr/share/php5/5.2.17/PEAR’) in /srv/www/[domain]/wp-content/plugins/easy-fancybox/inc/class-easyfancybox.php on line 424

Update: the new release 1.5.8.1 should work around the issue no matter what your server OS or PHP version… Could you try to update and let me know?

Is there a way to display something like “image 1 of 3” in the lightbox when using a group of images with the rel attribute? I’m afraid people won’t know there’s multiple images. Or is there a way to display the left and right arrows without hover so it indicates right away that there are more images.

Hi Suzanne, this is not possible without modifying the plugin or light box script. The advanced extension is planned to feature this option but it’s not ready yet. Sorry.

Thanks for the plug in, really love it. Unfortunately after updating to WordPress 4.7, with Easy FancyBox 1.5.8.2 the title no longer shows in Fancybox. Any suggestions?

Hi Dario, there are some serious script (jQuery) errors going on on that second site. You might want to start debugging by turning off autoptimize….

Wow, thanks very much – this is exactly what solved it for anyone else out there.

From Autoptimize plug-in settings I unticked ‘Optimise JavaScript Code?’ and YouTube videos are now playing as expected!

ps. Reason I used Autoptimize was to get rid of the Google Speed Test warning that is now back since making this change, the warning being for Mobile:
Should Fix:
Eliminate render-blocking JavaScript and CSS in above-the-fold content.

I’ll leave it this way though, thanks very much once again!

Hi Dario, the plugin places indeed a little script in the head section but it’s not “render blocking” in the sense that Google Pagespeed test supposes. It is only loaded there and does not do anything until triggered after page load. The code needs to be ready because in rare cases it needs to be triggered earlier but even then, it does not actually add any significant above-the-fold render time. Sadly, Google Pagespeed test does not know this and simply adds the (rather common) “eliminate render-blocking” should-fix warning.

That said, there is new version planned that will add an option to move the code snippet to the footer to get rid of the Pagespeed test warning. While some may need to keep it in the header, for most cases the footer should be fine too.

Hello I can you help me with this one. I’ve successfully implemented the contact form on my website with easy fancy box, but the problem is that the message that will say that the contact form has successfully submitted is not showing. Only a red line. Also when you have a blank input and just pressed submit, nothing happens, even the error message of contact form 7 does not show. Can you help me with this? I want to know if this is a css problem or contact form 7 problem.
This is the test website http://edeskaloans.com/edeskatest/production-knives/

Hi Cedric,

First, test the form without FancyBox. Move the CF7 shortcode outside the hidden div to make it visible on the page and do some test submissions. Does it show any response messages then? If not, then it’s an issue with CF7.

That normally happens when there is another light box running on the site. Either in your theme or another plugin… Best delete Easy FancyBox an d find a way to make the other light box work for you.

Hi iamartbc, a form is inline content. You can find how to embed inline content following the example in the FAQs 🙂

In this page (scroll to above the comments) under the heading “Frequently Asked Questions” then “Advanced” there are two questions that have example code that you can paste in your WordPress page editor Text tab. The most important one for you is “Can I display a contact form in FancyBox?” Click the link to open the explanation, copy the example to your site and replace the contact form shortcode with the one you are using.

Hi again RavanH,

Got 1 more simple question for you, I have a shortcode ( [formidable id=5] ) as menu it works fine pointing to that, but me and my creations minds, lol….

it’s there a way that when click on that menu it shows the form on the fancybox?

sorry to bother, still LOVE your work

Hi iamartbc, sorry I do not think I understand your question. Do you wish to open the contact from from a menu item? Then just give that menu item a class “fancybox-inline” (there are advaced menu options on the menu edit page) … If you mean something else, can you share a link to an example page maybe?

Heyyyy RavanH, thanks for so fast answer: Look

I use formidable forms, witch has shortcode for each form you create; Now someone (client) it’s asking me if there’s a way that Form is’t on the top menu.

so I did: http://bestteam.com.do/ (last menu has two forms), but he want’s that form opens with fancybox, thing is I did try to add the class to the menu with just the shortcode and what does is that straight up opens the form and without the fancybox.
ScreenShot: https://snag.gy/p4QjCx.jpg

So I believe that the question should be:

“I have a Shortcode of a form, that I want to add it as a Top Menu Option, that when it’s clicked It opens the form in FancyBox.”

Note: I use “shortcode in Menu” plugin to add the shortcode to menu. should i change this ?

With the advanced version you get the extra options and access to the pro support forum 🙂

Hi, full mobile/touch support should be there in the next release when the FancyBox 3 script will be integrated into the WordPress plugin.

Hi Ketan, the image title or description are not available to FancyBox. Only the image ALT text. You can put all you wish to show in the light box there…

Hello,

After the recent update, the plugin has errored, blocking any back end dashboard access on wordpress. I had to manually disable it within cPanel on my hosting company.

The error message is:
Parse error: syntax error, unexpected ‘[‘ in /html-directory-location/wp-content/plugins/easy-fancybox/inc/class-easyfancybox-admin.php on line 21

Kind regards,
Clint

You need PHP version 5.4 or above. Can you upgrade your server PHP? Preferably to PHP 7.0 or higher as recommended by WordPress…

You need PHP version 5.4 or above. Can you upgrade your server PHP? Preferably to PHP 7.0 or higher as recommended by WordPress…

Please help

The plugin was not activated, because it caused a fatal error.
Parse error: syntax error, unexpected ‘[‘ in /home/sands00/s-and-s.com.ua/www/wp-content/plugins/easy-fancybox/inc/class-easyfancybox-admin.php on line 21

You need PHP version 5.4 or above. Can you upgrade your server PHP? Preferably to PHP 7.0 or higher as recommended by WordPress…

You need PHP version 5.4 or above. Can you upgrade your server PHP? Preferably to PHP 7.0 or higher as recommended by WordPress…

hi,
To see the images in full size, I put images of 1024 pixels wide.
I would like to give the choice to the visitors, that they can click to see the image in size Reelle, thank you

Hello,

I used something like this to open a image in light box. It was working fine until the last update.


Click here

Please let me know how to make it work again.

Hi Craig, you may be suffering from a theme incompatibility that did not occur with the previous version. Can you share a link to your site?

Hi Harold, it looks like your theme is using an incompatible jQuery version loaded with

Any way to replace that with the default one included with WordPress?

Thank you for the reply. The 1.8.6 update fixed the issue. For everyone reading, I am using JQuery 3.3.1.
Thanks again!

Hi Henk, are the instructions not clear? Simply create a link to the YouTube page in your post content. With the Youtube option and Autodetect enabled on your Settings > Media admin page, this link will open the video in a light box…

Hi, Thanks for a wonderful plug-in. I use it for images and pdf files, and they all work great.
I have a question regarding how to get the images in a WP gallery to come up in the same size in a responsive way for mobile devices. I set the Link To in the gallery to Media files, and It’s working great with navigation from one image to the next. However, the images have different sizes, and the light box automatically adjusts depending on the image size. I’d like to have the light box to be of a fixed size independent of the image size. Is this possible, and how?

Dragon

Hi dragon, the light box was designed to adapt to the size of its content. You could try to force that content to have a particular size (scale) through CSS but I suspect that even if that works, it will create unexpected results and/or other problems…

Does its job well, almost too well. I have treid a lot of gallery plugins recently and easy fancybox is incompatible with like leterally every each one of them. Few examples being FooGallery, Modula, Jetpack, Everest, Envira and ofc NEXT.
Understand, its not like Easy Fancy Box doesnt work with them, it rather works way too well, forcing the galleries to use fancybox instead of their own build-in ones no matter what. I wouldnt mind even then, but after last update to 1.8.12 background fade stoped working, so the lightbox effect looks realy ugly. Ia still trying to find a workaround.

Hi Jarek, we gererally recommend not using two light box scripts on the same site. So if you have a gallery plugin that has it’s own light box, best to remove Easy FancyBox… Or if you really need FancyBox for something else (like a form or video popup) at least disable the Images option in the FancyBox section on Settings > Media… Or if you need it for stand-alone images then remove all image file extensions from the Autodetection field and give individual links the class “fancybox” manually.

Well, the Settings beginning with:

“FancyBox
Donate to keep the Easy FancyBox plugin development going!The options in this section are provided by the plugin Easy FancyBox and determine the Media Lightbox overlay appearance and behavior controlled by FancyBox.
First enable each sub-section that you need. Then save and come back to adjust its specific settings. Note: Each additional sub-section…”,

has a lot of options. It would be great if you include a sort of Print Options to facilitate the configuration.
Just a suggestion.
Regards
Luis

I’m afraid I do not understand how printing the options would help you… But I do appreciate your thoughts about the number and complexity of the options. You are right, it’s not very “easy” anymore. I’ll be searching for a way to make them easier 🙂

I have been using the plugin for years. Recently, I noticed a bug: users cannot close the lightbox. I have looked through all the settings and looked at browser activity with dev tools and cannot find what is causing the problem. You can see the problem here:

https://www.ldsagents.com/video/

Click a video and then try to close it.

Hi Brad, the plugin is not compatible with your theme which includes an older jQuery librairy and its own Fancybox script already. Sorry.

Test page: https://dev01.demo.site/lightbox-test/

In the plugin’s settings I have unchecked “Scale large content down to fit in the browser viewport.” under FancyBox > Window > Behavior because that is my desired behaviour on desktops.

But with this setting in place, the close button on mobile is really tiny and can barely be seen. Screenshot from iPhone X: https://cl.ly/ec04c440359d

In fact, it can not be seen unless we scroll a little up.

Is it possible to make it behave as if “Scale large content down to fit in the browser viewport.” is ticked on mobiles only?

Hi Sridhar, no that is not possible but an interesting idea… Your only option is to disable the light box effect for small screen sizes by setting the option “Minimum browser/device viewport width” on Settings > Media under the Miscellaneous section.

Thanks for the reply.

Another semi-related question.

With “Scale large content down to fit in the browser viewport.” unchecked when the linked image’s width is wider than viewport, it is getting cut off at the right as can be seen by clicking on the top image at https://dev01.demo.site/lightbox-test/.

Is it possible to have it auto fit to browser’s viewport instead of 100% of the image width? I just want the viewer to see the full image (width-wise) at maximum possible size.

Hi, the plugin works well for me and I find it very useful. I was however wondering if there was a way to display two different iframe popups (one for mobile, the other for desktop), with different width and height characteristics using the plugin? Thank you

Hi joban, I see what you mean. There is a blocking script error occurring on desktops: “Uncaught TypeError: Cannot read property ‘0’ of undefined” which is breaking subsequent script execution (including FancyBox). The error comes from the revslider script…

Leave a Reply to Danny (@playrustBLOG) Cancel reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: