-1

I am trying to build a Facebook app that generates a tab that includes a page's wall complete with "post to wall" dialog below some content. So far the only app that I know that does that is Bandpage (for example http://www.facebook.com/beyonce ).

It turns down that rendering a wall this way in an iframe is not trivial. Here are some of the approaches I've researched:

  1. Using curl to scrape a wall: not only is this an ugly solution, but Facebook protects against that.
  2. Using Social Plugins ( http://developers.facebook.com/docs/plugins/ ): Like Box (http://developers.facebook.com/docs/reference/plugins/like-box/) renders a wall, and with "faces" and "header" options turned off + Autoresize js call it almost looks like what I want, but does not include a comment field and the look of the box can't be customized.
  3. Using Graph API it's easy to get the wall's feed in JSON, but then rendering and styling it is a nightmare - there must be a simpler way.
  4. Using fb:wall - this is deprecated and will be turned off in a few months, but it's not even working as a stopgap. Or does it?
  5. Using fb:fan which supposedly takes a css stylesheet.

So - it seems possible to render the wall in a tab since Bandpage is doing it, but how?

Charles
  • 50,943
  • 13
  • 104
  • 142
deadprogrammer
  • 11,253
  • 24
  • 74
  • 85
  • Sometimes Facebook enters into special partnerships with large corporations and celebrities to bring them special case scenarios. Meaning they get resources available to them that are not part of the public API offering. I believe what we're seeing here is just that, a special partnership between Facebook and Beyonce. – DMCS Jan 18 '12 at 15:03
  • This is a standard feature of Bandpage, not a custom app built for Beyonce. – deadprogrammer Jan 18 '12 at 15:11

1 Answers1

5

This might possibly help you overcome your problem in #3 :

Using Graph API it's easy to get the wall's feed in JSON, but then rendering and styling it is a nightmare - there must be a simpler way.

Trying to "recreate" the look and feel of any good implementation is a hard task.

The following link might assist you with styling your own elements to look like facebook elements.

http://ckrack.github.com/fbootstrapp/

Fbootstrapp is a toolkit designed to kickstart development of facebook iframe apps in both relevant sizes. It includes base CSS and HTML for typography, forms, buttons, tables, grids, navigation, and more, styled in the typical facebook look and feel.

Here are a few examples of the styling :

enter image description here
(source: softpedia-static.com)

Notification boxes

enter image description here
(source: softpedia-static.com)

Form Elements

enter image description here
(source: softpedia-static.com)



In closing I would like to bring to attention the ever nearing deprecation of FBML.
We as facebook developers are solely responsible for keeping up-to-date with the changes that 3rd party API's, on which we base our development, make to their systems. There are no alternatives to FBML, only new (and in many cases) better ways to display/extract data from facebook's servers.

A great place to keep updated on changes and new features would be the Facebook Developers Blog and the Facebook Developers Roadmap.

Community
  • 1
  • 1
Lix
  • 47,311
  • 12
  • 103
  • 131
  • 2
    Great answer. Hope you get the bounty!! – DMCS Jan 24 '12 at 11:32
  • How very kind of someone to come and downvote a perfectly valid answer rendering it ineligible for the bounty. Fantastic way to start the day... :/ – Lix Jan 30 '12 at 07:49
  • 1
    lol, it happens. I've answered a lot of questions on SO, only to find the bounty somehow mysterious vanish. Then just a day later, the person accepts the answer without giving the bounty. "Something strange is afoot at the Circle K". – DMCS Jan 30 '12 at 15:01