Facebook has changed the interface and some of the fields for creating new iframe applications. Here are the updated instructions .
Since last week, there has been a lot of excitement over the changes to Facebook fan pages and how this will effect custom tabs. I am not writing about all of the changes as that has been covered elsewhere – an excellent article is Everything You Need To Know About Facebook’s Epic Upgrade To Pages by John Haydon.
One piece of news is that FBML is being deprecated and after March 11, 2011 it will no longer be possible to add the Static FBML application to pages. Static FBML is what many of us have used to create custom Facebook tabs. Existing tabs will continue to work and it will be possible to edit them but new pages and tabs will not be able to use this application. I don’t know how long Static FBML will work before Facebook takes it away completely.
Instead new custom Facebook tabs will need to be created with Iframes. Current tabs don’t have to be transitioned before March 11th but you should do so at some point over the next couple of months.
How do we do this? Well, I spent some time figuring this out and here are the instructions.
Custom Facebook Tab with Iframes
- Make a html, php or other type of web page and upload it to your web server. Instead of the code going directly into the Static FBML application the iframe application will be pulling the page you made to Facebook. This page will still need to fit within the Facebook size limit of 520px wide.
- Go to the Facebook Developers site.
- Create a new app by clicking on the ‘Set Up New App’ button.
is the name of the file you uploaded. In my example it is index.html
Click More> Edit at the bottom of the list and you can move the tab higher up the list but it can’t go higher than Wall and Info.
- You will have to make one of these for every custom tab that you want to make – if a page is going to have three custom tabs you will need to make three iframe apps for it.
- It is my understanding that if you are not logged into Facebook, you will not be able to see a custom tab created with iframes. This is not good for google searches that were locating our custom Facebook tabs. If I am wrong about this, please let me know.
- I have not yet figured out how to use code similar to visible to connection that is used to hide content from people who haven’t liked the page.
- You can add your Google analytics tracking code just like you would to any web page!
- You could make different pages in advance and quickly swap them out by simply changing the Tab URL in the application settings.
- Other? – You tell me.
You can visit the iframe tab I made here. I made a couple of changes to the content but I do need to update the video and make other changes.
If you would like assistance creating iframe tabs or transitioning your current tabs to iframes, please contact me for rates and to get added to my schedule.