Note: Width of your page must be 520px or less to avoid horizontal scrolling.
- Go to http://www.facebook.com/developers/
- Click “+Set Up New App” in the top right corner
- Give your app a name and agree to the Terms
- About Section
- Enter descriptions and icons if necessary.
- Web Site Section
- Enter your site’s URL. This is where the custom tab is being pulled from. Example: http://newsroom.cisco.com/
- Facebook Integration Section
- Create a name for the Application page under “Canvas Page”. Example, http://apps.facebook.com/ciscotopstories.
- Enter the “Canvas URL”. This is the base directory for the page that is being pulled into the iframe. Example: http://newsroom.cisco.com/facebook/
- Make sure “Canvas Type” is clicked on iframe.
- Under “Page Tabs” enter the “Tab URL”. This is the actual page that will be pulled in through the iframe. Example: http://newsroom.cisco.com/facebook/topstories.html
Voila, the tab is done. Simply go the application profile page, located at http://facebook.com/developers, to add the tab to your fan page. Have you incorporated custom tabs into your Facebook page? What methods did you use? What was your experience? Any and all comments are welcome and, as always, feel free to connect with me on Twitter – @arom1000.