FooBox FAQs

Why are there weird symbols where the sharing icons should be?

FooBox 2.0 welcomed in the use of font icons for the navigation arrows, close button, full screen button, loading animation, and all the social sharing icons. This enables those icons to look sharp and crisp on any size browser as well as being retina-ready. But is also means using a more modern technique which some older browsers or less supported browsers don’t implement very well.

The most common reason some browsers might not show the font icons is because they have turned off the ability to allow websites to load their own fonts. Firefox, for example, is a very well supported and widely used browser, but some security settings put the “Allow pages to choose their own fonts” settings gets set and interferes with font icons.

Luckily, well supported browsers allow you to go in and change that setting. Here’s a screenshot for changing that setting in Firefox. 

If you are having trouble with icon fonts, look in your browser for a similar setting.

Images Take a Long Time to Load

The likely cause for this is that the images you’ve uploaded to your site are very large.

Please verify that the images you use have been saved at an optimal file size before uploading them to the WordPress Media Library or your image gallery plugin.

Thumbnail Gallery Images Look Distorted

FooBox does not create gallery thumbnails. FooBox is only responsible for creating the modal lightbox that loads the individual images.

If the thumbnail images in your gallery look distorted, it’s likely an issue with your gallery plugin or theme stylesheet.

The last possibility is that you’ve uploaded a very small image and selected the “Fit to Screen” option under FooBox’s “General” tab. Unselect that, refresh the page (clear your cache if you have any caching plugins or services), and load the image again. If it is not repaired, then the issue is with the image itself or the gallery plugin (as mentioned above).

The Loading Spinner is not Showing

This happens 99% of the time when there's a YouTube video on the page that you are loading FooBox on, and you are using an older operating system or browser. This is easily resolved by adding ?wmode=transparent to your YouTube url. Sometimes you'll have multiple arguments in your YouTube url, like "?autoplay=1", for example. In that case, make sure to put the "wmode" argument first in the url.

FooBox shows fine in the admin demo, but does not work on the front end

There can be a few possible reasons for this:

  1. There might be a javascript error caused by a plugin or theme that prevents the FooBox code from starting up. Check to see if there are any errors by loading Chrome Developer tools. It will show you where the problem is originating.
  2. The version of jQuery your theme is using might be outdated. FooBox requires at least jQuery v1.6 to function. (You could try upgrading to the latest version of WP, which has an up to date jQuery version)
  3. Check to see you have the correct FooBox settings enabled. If you are using NextGen, make sure you have enabled the NextGen setting etc.

Seeing Double Scrollbars

The problem happens because FooBox hides the scrollbars when it is active, and then when it puts them back again, the browser goes a bit crazy and puts double scrollbars.

To stop this from happening, make sure to uncheck the “hide scrollbars” option in the FooBox settings page. That will stop FooBox from hiding them in the first place, so when FooBox is closed, it will not try to put them back.

Is FooBox compatible with NextGen 2.0?

Yes it is. As with any major plugin release, there are bound to be bugs and quirks when updating to NextGen 2.0. So far, in all of our testing, all NGG galleries we’ve had FooBox on kept working seemlessly after we upgraded to 2.0. But there are some significant changes to the way NGG works in 2.0 that we thought needed addressing. Read the full post on it here.

How Can I Integrate FooBox with NextGen Gallery?

We’ve worked together with the developers of NextGen Gallery to make sure FooBox works seemlessly with their stellar Gallery plugin. In order to integrate these two plugins you need to set just a few basic settings:

NextGen Gallery Settings

  1. Go to the “Options” Menu under “Gallery” in your main left-hand menu.
  2. Then choose the “Effects” tab
  3. Then select “Custom” from the drop-down menu there and save.

FooBox Settings

  1. Go to the “General” tab of your FooBox setting
  2. Select “NextGen Gallery” under the “Use With” section

Next you want to make sure that your captions will appear correctly and be shared in the various social media outlets correctly.

  1. Go to the “Look and Feel” tab
  2. For the “Override Caption Title” section, choose “Image Alt”
  3. For the “Override Caption Description” section, choose “Anchor Title (NextGen description field)”

Fancybox (or another lightbox) Opens Behind FooBox

Other lightbox plugins are integrated tightly into some themes and plugins (like WooCommerce). Try to disable them from your theme’s option page, but if you cannot then FooBox might be able to help.

We have built in code that removes prettyPhoto and FancyBox. Just enable TWO options under the “Advanced” tab in FooBox’s settings:

  1. “Disable Other Lightboxes”
  2. “Try to deregister other lightboxes”

I’ve tried everything and my theme’s lightbox just won’t turn off. What do I do?

There are some cases where a lightbox is integrated so tightly with the theme itself that our FooBox advanced settings can’t override it. It is possible to go into your theme files and comment out the script that loads the lightbox. The problem with doing that is every time your theme gets updated that change will get over-written and you’ll have to go and do it again.

Rather than all that headache, we’ve developed a “LIGHTBOX KILLER”. This is a really small plugin that will disable all lightboxes except FooBox. We like to call it our “nuclear option.”

Download the Lightbox Killer here.