views:

1093

answers:

2

Hey guys, I have developed a small site that i would like to embed into a tab on a facebook page.

Previously I used this code to load in an iframe, it worked great:

        <a onClick="outside_location.setInnerFBML(link_1);" style="cursor: pointer;">Link 1</a> | <a class="red" onClick="outside_location.setInnerFBML(link_2);" style="cursor: pointer;">Link 2</a>

    <div id="outside_location"></div>
    <fb:js-string var="link_1"><fb:iframe width="760" height="1280" frameborder='0' src='http://www.WebWhispers.in' /></fb:js-string>
    <fb:js-string var="link_2"><fb:iframe width="760" height="1280" frameborder='0' src='http://google.com/' /></fb:js-string>

    <script type="text/javascript" charset="utf-8">
    var outside_location = d

document.getElementById('outside_location');
</script>

However, it has stopped working. I dont think facebook allows iframe inside of pages, only applications.

How can I load this page in without learning FBML? The site uses Jquery so I cant use FBML anyway.

I know applications can use iFrames, can I make it an application and then embed the application into a page tab somehow?

A: 

No. Tab pages can not contain iFrames. They must be written using FBML and FBJS.

One reason for this is that Facebook does not want to enable Tab pages to detect who looks at them. All requests (including images) on tab pages are proxied through Facebook for this reason. If iframes were allowed then the application would be able to detect who looked at it, which would present a privacy issue for Facebook users.

Gdeglin
Hrm okay. How do applications get away with it then?
Wes
They don't. No tab pages can contain an iframe.If you're interested in having dynamic content on a tab page you can use FBJS (a special version of javascript that is sandboxed), or use Flash. If you use flash the user will first have to click on the flash application before they can interact with it (For the same privacy reasons that I mentioned above).
Gdeglin
Ah, I understand. What route did these guys use:http://www.facebook.com/CarrotCreative#!/CarrotCreative?v=app_176990672178
Wes
That's an FBML page. The rollover effect on the lower left is done using a CSS hover declaration. The left right buttons on the top use FBJS.
Gdeglin
A: 

This is either a policy change by Facebook or, more likely, a bug. I say it's unlikely to be a policy change as it throws a script error, whereas a policy change would more likely strip the code out before it's rendered.

There's a bug report you can add votes to and follow here.

Karl B
That bug is unrelated to this.This is not a bug. The documentation on fb:iframe specifically says that it can not be used on pages. http://wiki.developers.facebook.com/index.php/Fb:iframe"you cannot use the <fb:iframe> tag on the profile page (that is, application tabs and profile boxes)"
Gdeglin
The bug is exactly related to that, and was confirmed as such yesterday by the Facebook platform team: http://forum.developers.facebook.com/viewtopic.php?pid=209031#p209031. The script Wes posted is a fairly well-known workaround whereby an fb:iframe is loaded in using FBJS. As the loading needs to be triggered by a user action (e.g. a click) it means it can't be used for user tracking.
Karl B

related questions