Facebook Page Tab/Facebook Canvas App/Fan Page - facebook

This all sounds confusing;
I have a Facebook Canvas App with the same name as the Fan Page. I would like to add an iFrame tab to the Fan Page to promote and link to the Canvas App. My question is do I have to create a new app for the iFrame tab, or do I open my app settings for the canvas app and add settings for a page tab as well in there. Facebook don;t seem to have much documentation and they are changing things for app profiles soon, so I want to make sure I keep my fans of the page.
Thanks in advance.

Basically it goes like this.
You have an iFrame app.
The iFrame app has a canvas which is where you load your html for your app from your webserver with whatever language you want (.NET, PHP etc)
Then you can add this iFrame app to your page.
When you go to http://apps.facebook.com/yourappname
You will be shown the app by itself. When you add it to your page and load it via the tab on the menu of your page it will show you the app within the space on your page (an iframe).
You can use code to detect whether you are on a page or not to display different things.

Related

Customising a Facebook page - Page App vs. External app with iframe?

Trying to decide between creating a Page App vs. iFrame (Load a hosted page somewhere else like AWS or APP Engine)
I am trying to create a 'tab' on a Facebook page where users can upload pictures to that page for a contest app.
I would like to create some customisation for this contest page.
Hence not using popular off the shelf contest providers like wishpond etx.
The user should be able to view his uploaded pictures on the top layout of the screen while the latest uploads of other users (trending, most liked) can get displayed at the remaining mid, bottom section of the page.
To attain this feature of custom layouting a page, would you recommend creating a 'page app' or create a Javascript based HTML page and host it outside on 'external web server' and render in an iFrame app within my tab ?
If it can be done both ways, would like to hear some adv/disadvantages of each approach.
Hope it explains.
Let me know if I was not clear.
Thanks,
Srik
What´s better is opinionated, but here are the main differences between a Page App (that runs in an iframe on a Facebook Page) and an external Website:
Page Apps don´t work on mobile, so you have to share an external link, check for mobile and keep mobile users on the external link while redirecting desktop users to the Page App.
Page apps are restricted to a width of 810px.

Redirect Facebook App to Facebook Canvas App (Fluid width)

I'm having a mental meltdown with Facebook and the way it handles Apps and Canvas Apps (apps with fluid width).
I can't figure out how to get a Page Tab to link to a fluid app. You can see an example on Coca Cola's fan page.
https://www.facebook.com/cocacola > Coce Zone tab
First it loads normal blank app which reloads to fluid app.
I have looked at the redirect code and it seems to be a form that submits itself after the page is done loading. After a bit of research I figured out that Facebook creates that itself.
My Page App directs to here but console says this:
Refused to display 'https://apps.facebook.com/ford-koeajotalkoot/' in a frame because it set 'X-Frame-Options' to 'DENY'.
In the app settings below the Page Tab there's Page Tab URL. There you must put an url to file with the redirect. It can be as simple file as below:
<script>
top.location.href="https://apps.facebook.com/YOUR_CANVAS_URL/";
</script>
It will then redirect to your app.

How to add an iFrame page Tab application to an Application profile page?

I've been trying to set up my Facebook Application Profile Page by adding an iFrame tab to it. Seeing as this is similar to the process of adding an iFrame tab to a Fan Page, I going through the same process, to no avail.
In order to add an iFrame tab to a Fan Page, one is required to create a Facebook iFrame Page Tab Application (process described here: http://www.hyperarts.com/blog/tutorial-add-an-iframe-application-to-your-facebook-fan-page-fall-2012/), and then browse to the newly created app's page, click the 'Add to My Page' link and select the page to which they want to add the iFrame Page Tab Application.
Now, if I want to do the same thing, but instead of adding the iFrame Page Tab Application to a Fan Page, add it to an Application Profile Page, then that's impossible because, apparently, Application Profile Pages don't appear in the window where you'd select the page you want to add the tab to. I've seen other applications that have done it, and have tried many approaches, none of which seem to work.
Any ideas?
Ultimately, my goal is to create a tab in my Application Profile Page, with my own content (which is basically just a picture with a link on it). Tried using the FBML app that Facebook provides but the problem with that is that they don't let you customize the icon to the left of the tab when using the FBML app, and using the iFrame Page Tab Application (as described above) is a workaround, but then I can't add it to my App profile page :\
Thanks

Links to external site in canvas tab on facebook page show up within canvas instead of redirecting to new page

I'm on a bit of a deadline and I'm having a problem with the canvas app I designed as a tab on my facebook page.
Using Dreamweaver to create the canvas I have set pictures that link to external websites. Unfortunately, when you click on the linking pictures, the websites are loaded within the canvas area on facebook. I would like them to redirect the entire page to the website link.
Forgive me if this is a ridiculous question, I'm rather new at this whole thing.
UPDATE Okay, figured it out. To anyone who's just starting out like me, all you have to do to have it redirect to a new page is put target="_top"></a> just at the end of your link in the webpage code.

FacebookSDK-5.0.25.0 for a Iframe Canvas App, after autherization user is redirected to canvas page

I am working on web application with .net 3.5 using C# facebook SDK. Loading page inside Page Tab iframe with some information, and input button, on click of button i am doing auth.Authorize() with some permissions, FB Permission window opens fine, but once user click on allow button it is redirecting to application canvas page instead of Page tab.
Is there anything i am missing?
Regards
Imran
Answer is to set auth.ReturnUrlPath which will bring user back to selected tab in facebook page. If your application is being added to multiple pages, then you can find out current pageid from "signed request" and set correct ReturnUrlPath, and attach ?sk=app_YOUR_APP_ID as querystring to ReturnUrlPath so current tab will be selected. your return path will look something similar to : http://www.facebook.com/profile.php?id=YOUR_PAGE_ID&sk=app_YOUR_APP_ID (make sure you handle both http and https)
This worked for me, hopefully will work for someone too.
-Ims
Facebook C# SDK doesnt support tabs.
Only canvas apps are supported.