Facebook Page Tab is Blank - Common Causes

Using a Facebook Page Tab can be a great way to promote your site by showing content from your site within your Facebook Page. It's a powerful, yet simple, way to show a newsletter subscription form, product page or view of your blog on your Page. Well, it should be simple. Sometimes, it just doesn't work and, when it doesn't, it can be very hard to diagnose. We've worked with thousands of users to integrate Facebook with their website and want to let give out some easy pointers on where to look first.

Generally, there are 2 reasons we commonly run into when a Facebook Page Tab is blank and not showing. While the below discusses Page Tabs, the recommendations are the same for a Facebook Canvas area if you're having issues with those.

How a Facebook Page Tab and Canvas Work

It's useful to have a quick understanding of how Facebook is loading your content in their site. First, in your Facebook Application settings, you must set the URL from your site to that Facebook should show from your site. Then, when a visitor goes to your Facebook Page Tab, the following happens:

 

  1. The user's browser sends a POST request to the Page Tab URL you specified. This POST contains some data about the user and validates that the request is actually coming from a user on Facebook. This data allows your site to customize or alter the response for the specific viewer.
  2. The response from your site is displayed within an iFrame in the user's browser inside the Facebook Page area.

With that quick overview, the below areas are where we've seen most issues with displaying a Page Tab or Canvas area.

SSL Is Required

Since 2011, Facebook has required that your site must have a valid SSL certificate installed to be displayed within a Facebook Page Tab (or Canvas area). If you don't have an SSL certificate installed on your site, the Page Tab will not work. A self-signed certificate is not allowed. You must have a certificate installed from a valid certificate authority.

Solution: If you don't already have an SSL certificate, one can be obtained for less than $20 per year and we have a full SSL installation guide that should help.

Server Restrictions on iFrames

For security purposes, browsers respect a special header your server setting your site may send called 'X-Frame-Options'. That setting allows your server to restrict how your site can be viewed in an iFrame. For instance, a value of 'ORIGIN' means that an iFrame to your site can only be called from another page within your site. If 'ORIGIN' is used, then the domain Facebook.com would not be allowed to display your content in the Page Tab or Canvas area and, instead, it will just be blank.

Solution: Check your server or security extensions to verify they are not setting the X-Frame-Options setting.

POST Requests to Your Site Fail

Since Facebook is making a POST request to your site, you need to make sure that your server can handle the request and that it doesn't alter the page response in an unexpected way. On a few sites we've worked with, we've seen that a POST request (any POST request) will cause some extension or other feature to responsd with different content than a normal load of the page.

Solution: Ensure that POST requests with arbitrary data are handled without issue on your site.

That's it!

We've seen all these issues, and more, when dealing with social network integration with our Joomla extensions and hope this helps narrow things down for you. Hopefully, these solve any issues you run into as well, but if not, let us know in the comments below.

Alex Andreae

Alex co-founded SourceCoast Web Development in 2008. Based in sunny Florida, SourceCoast develops extensions for integrating your Joomla powered website with popular social networks. He has spoken at more than a dozen Joomla User Groups and Joomla Days, including the Joomla World Conference in both 2012 and 2013. Topics have included social networking for Joomla, running a business around Joomla extensions, and Joomla development.


Find Alex around the web: