Troubleshooting FAQs

FooBox Documentation

Troubleshooting 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 adjust the “Allow pages to choose their own fonts” settings which interferes with font icons. Luckily, well supported browsers allow you to go in and change that setting. 

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).

Fit to screen settings for FooBox

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.

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 some well known lightboxes using a small amount of sneaky scripting. Goto the FooBox settings page and enable the “Disable Other Lightboxes” setting.

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.

The best option would be to contact your theme developer and ask them to build in a setting which allows you to disable the built-in lightbox.