Do I need an appId for a XFBML version of the Facebook Like button?

Question

I'm really confused.

I'm trying to use some of the very simple Facebook plugins on my site, specifically the basic "Like" button.

I already know how to use the limited version with an iFrame.

However, now I'm trying to figure out the XFBML method and the online documentation seems to make a lot of assumptions about what you already know and really short on working examples. For example, they show you how to call the JavaScript Init and give you the single line of HTML code for element fb:like... but I could not see any examples of how to show/hide faces, set the default font, etc. like in the iFrame code.

I've since figured out that you need to add them as attributes to the element but that was thanks to StackOverlfow and no thanks to the Facebook documentation which simply takes you in circles.

<fb:like href="http://mydomain.com" show_faces="true" action="recommend" colorscheme="light" width="400" height="35" />

Ok, so now when using the XFBML code, it's height should expand/contract automatically depending on being logged in or not I assume.

I do not know if I'm supposed to initially set the height to "80" or if that happens automatically.

And I have no idea what I'm supposed to use for 'your app id' in the Init script. There is no App... just a Facebook Company Page... so why would I need an App Id when I'm just putting a Like button on a website?

<script>
window.fbAsyncInit = function() {
  FB.init({
    appId: 'your app id',
    status: true,
    cookie: true,
    xfbml: true
  });
};

Any enlightenment on these issues would be appreciated.

Thank-you!

Solution 1

Answering my own question, after pulling out all my hair...

http://developers.facebook.com/docs/guides/web/

"The JavaScript SDK requires that you register your website with Facebook to get an App ID (or appId). The appId is a unique identifier for your site that ensures that we have the right level of security in place between the user and your website. The following example shows how to load the JavaScript SDK once you have your appId:"

http://developers.facebook.com/setup/

The title of that page/form is Create an App. I still don't understand why they don't use more generic terminology. I'm not "creating an app" and I don't consider my website to be an app.

Solution 2

I don't have an appId but just got this code from the like code generator and it seems to work in my local environment (which uses localhost:8000 yet still has 136 likes). When I press the buttons I get the facebook login popup as expected.

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<fb:like href="url here (optional)" send="true" width="450" show_faces="true"></fb:like>

Comments

[Peter Ehrlich]

Leaving off the appId=3990840334890 seems to work just fine

[benzkji]

@PeterEhrlich I guess you will just be missing stats/insights, when not providing an appId. Seems to work for me as well. Event with comments plugin...