Why is my HTML FanGate Tab Blank?

Last Updated: Jun 11, 2015 01:23PM PDT

Are your HTML FanGate Tabs currently showing as blank inside Facebook? Read on to find out why this may be occurring…

Your Facebook page tab can be blank for a number of reasons, but the most common reason is due to how browsers handle secure and insecure content loaded in a web page at the same time. Internet Explorer and Firefox are both know to hide mixed content pages as a default setting. To ensure your page tab content is visible to all users, you need to make sure that you do not load any CSS, Javascript, or Images from insecure (HTTP) locations. Because Facebook defaults users to HTTPS, all resources must be loaded over secure (HTTPS) locations.

Firefox made an update to their browser that's causing these display issues. As of the release of version 23.0, they no longer display "mixed security content" by default (http://www.mozilla.org/en-US/firefox/23.0/releasenotes).

Why/How Does This Affect Me?

Facebook uses HTTPS by default, which means any content you host in our tab will have to use HTTPS as well to display properly. If you are only using a single image for the page tab content, Woobox will automatically host that image over HTTPS. If you are using HTML however, you must host your images and other content over HTTPS. Many hosting providers offer this capability and it may be as easy as changing the HTTP to HTTPS in your HTML. In the cases where that does not work, we recommend Amazon's S3 services for easily hosting HTTPS content. Once you upload your content to S3 you will get an HTTPS url that you can use to replace the current URL in your HTML.

Alternative Free Solutions Hosting
  • Imgur (make sure you change the image src URLs to HTTPS)
  • Dropbox
  • Google Drive

How do I find the non-secure resources on my page tab?

  1. In Google Chrome, press CTRL-SHIFT-J and click on the Console Tab. In Firefox, press CTRL-SHIFT-K
  2. Visit your page tab.
  3. You should see error messages in the console that indicate which content your tab is trying to load that is in-secure.

What If I’m Displaying a Website for the Tab Content?

If you're hosting other files from your own site, you may need to get an SSL certificate if you don't already have one, and change the URL to HTTPS. These can often be found for under $20/year, and you could use one SSL certificate to cover many fangate tabs.

When Did This Happen?

This has always affected non-secure content in tabs (especially for IE users); but with these changes to other modern brosers (Firefox and Chrome), and with more users updating to the latest version, the issue is becoming more common.

If you would like to know how to fix this issue on your own computer (just for yourself, on that particular device), you can go to http://mzl.la/13jCUSU.

TIP: For more information about the issue in general, and how to fix it, check out our blog post When Good HTML FanGates Go Bad, as well as the following great step-by-step guide: Switch to HTTPS Now, For Free.

UPDATE:  Chrome 30 now no longer display "mixed security content" by default, as well as Firefox.