Sounds like a silly question, but...
I'm adding the Facebook Javascript SDK to a site that appears to be in HTML5, it has a
<!doctype html> and a <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> so I'm assuming this was the original authors intent.
However, looking at the Google Analytics for the site, there might be quite a few people using IE8 to visit the site.
We don't want to use iFrames because the XFBML and HTML5 versions are more versatile.
So this is why I am asking if should I use HTML5 or XFBML for the page?
If your page is html5 then some browsers won't be supported, if you want to support all browsers don't go with html5, it's that simple.
With that said, I don't think it makes much difference which option you'll go with, and that's because in both cases you are loading the same facebook javascript sdk which then renders the plugin where the placeholder is placed.
The only difference between the two versions is how you define the plugin options in that placeholder, in html5 you're using data- attributes, and in the xfbml version you just define the facebook namespace and use custom attributes.
But both versions should work for all the browsers that are supported by facebook, the most that you'll get is invalid html in some browsers if you take the html5 version, but it should still work.
You should use XFBML as I see you get more IE users on your Google Analytics service, so I assume it is hard to ignore all those users .
Related
I have a page in my website to invite Facebook friends to use my website and the code is pretty standard stuff
<fb:serverFbml style="width: 755px;">
<script type="text/fbml">
<fb:fbml>
<fb:request-form ....
<fb:req-choice />
>
</fb:request-form>
<fb:multi-friend-selector .../>
</fb:fbml>
</script>
</fb:serverFbml>
As far as what I understand, because I am including FB JS SDK, it interprets the XFBML tags and includes the appropriate html for the same (which is interpreted by the browser).
I hear that FBML is being deprecated. I am assuming that this will not affect the XFBML tags, rt? Can someone please confirm? I am confused because all these tags have been listed in FB documentation under Advanced Topics › Legacy FBML › fb:serverFbml.
I also have other tags in various other pages like <fb:profile-pic>, <fb:name>, <fb:title>, <fb:iframe>, <fb:google-analytics> Should I be migrating them to their HTML equivalent?
Is there some documentation on how to go about doing this? Any inputs is highly appreciated
Thanks.
fb:multi-friend-selector never had XFBML versions but only FBML which isn't the same since FBML only works in application canvas and only for apps that use FBML (not an iframe)
Cite from FBML documentation
We are deprecating FBML. On Jan 1, 2012: FBML will no longer be supported on Platform. June 1, 2012: FBML apps will no longer work. All FBML endpoints are removed. If you are building a new application on Facebook.com, please implement your application using HTML, JavaScript and CSS. You can use our JavaScript SDK and Social Plugins to embedded many of the same social features available in FBML.
Update:
You still can use it with FB.XFBML.parse method of JavaScript SDK.
In your case looks like you should move fb:multi-friend-selector to be within fb:request-form (like it shown on fb:request-form documentation.
But I strongly suggest using Requests Dialog with JavaScript SDK instead of FBML tags
Update 2:
While not officially confirmed (yet) I'll allow myself to speculate on this a bit. Probably every FBML tags will be removed and fb:serverFbml will not be parsed by JS-SDK after June 1, 2012.
You can try to ask about this on Quora (with a big change to get response from one of officials
Using a Facebook comment box social pluggin. Our site is currently in the beginning process of converting to an HTML5. But, noticed with the Facebook comment boxes there is no option for pre-HTML5 codes. In the Implementation pull down it only has HTML5 or xfbml - Why not have a pre-HTML5 option as well?
The HTML5 output by the Facebook plugins is also valid pre-HTML5. It's just a <script> tag and a <div> tag.
We've invested some time into using the Translations app for our old-style FBML facebook apps. The creation of FBML apps is now deprecated, and only iFrame apps can be created. We would like to have translations in them too, and are considering how to use the Translations app to achieve this.
The internationalization page indicates translations are renderable through (deprecated) FBML tags like fb:intl. It also mentions that XFBML tags (the "newer" tag-set parsed by JavaScript) can play a part, however the documentation for the JavaScript FB.XFBML.parse(..) XFBML method doesn't list any XFBML internationalization tags available to be used with it!
In short, I would like to know if we can use the Facebook Translation app for translations inside an iFrame app, without using any deprecated technology?
[The state of facebook, May 2011]
Since we were trying to use these features and they're still not working I just went ahead and wrote a wrapper that will help parse these tags (using intl.getTranslations and intl.uploadNativeStrings in the background).
It's a bit rough but seems to do the job. Would love to see some forks:
https://github.com/yeldarby/translation.js
If you are using JavaScript SDK just like this:
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : 'YOUR APP ID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
</script>
Then on this line, change the en_US into your language's code:
<script src="http://connect.facebook.net/en_US/all.js"></script>
You may also use FQL (Not to be deprecated by facebook)
http://developers.facebook.com/docs/reference/fql/translation/
The docs indicate that you can do it, but you can't.
The only way you can use the translation app is by calling intl.getTranslations, intl.uploadNativeStrings, or querying the FQL translation table
I'd like to place my google docs form(for newsletter sign-up) on my facebook page.
using this tutorial I was able to create an app, but no content showed http://www.hyperarts.com/blog/adding-iframe-application-to-facebook-fan-page/
So I wanted to know if there was another way of doing this, or anyway of doing this at all.
I had the same issue with using the iframe that google docs give you and using the url for the application tab on Facebook. The resulting facebook page is blank.
What I did to resolve this is whip up a simple html file that does the embedding from google and placed it on my (ssl encrypted) server. Then I used the url to that file as the application tab URL in my facebook app. Viola it worked.
Is Facebook not allowing embeds from docs.google.com? There's a simple workaround.
Here's the code from my html file on my server with the formkey mangled to protect privacy.
<html>
<body>
<iframe src="https://docs.google.com/spreadsheet/embeddedform?formkey=dGhOU" width="500" height="780" frameborder="0" marginheight="0" marginwidth="0">Loading...</iframe>
</body>
</html>
There's a php class that i've been using. It provides functionality to capture form elements into a google doc.
That's a possibility but requires a larger learning curve if you're not familiar with PHP:
http://code.google.com/p/php-form-builder-class/
I am working on writing a small Facebook application just for fun and learning. Unfortunately, the Facebook developer documentation, wiki, and samples leave much to be desired.
If my application is an iFrame app (PHP), can I use FBML within the page or do I need to use the XFBML? If I need to use XFBML, is there a repository of snippets somewhere that I could look through?
I am looking to add a friend selector box. For example, welcome to the app, pick an object, send it to 20 friends.
You would think a friend selector would be a stock component for Facebook apps, but apparently not.
I can use FBQL and CSS to define my own, but wouldn't standards and consistency be nice?
Is there a definitive, from the ground up, easy to follow Facebook app developers tutorial that covers the FBML tags, the XFBML tags and what goes where with examples?
I think in every answer I make to a Facebook question, I pretty much mention that "Facebook documentation sucks, so don't feel bad if you can't find something."
The answer is yes, you can definitely use FBML in an IFrame application. I do it routinely. Facebook is blurring the lines between IFrame apps and FBML apps with XFBML, which is great. Basically, XFBML is just regular FBML, except that it is parsed and rendered via the Facebook Connect javascript libraries. Because of this, you see a bit of a delay before an FBML control is rendered, but generally this isn't a big problem.
I'll give you an example of loading a friend selector straight from one of my IFrame apps. You'll see that it's surrounded by fb:serverfbml tags, which you need to render several of the more complicated FBML tags. The FBML items that don't need a fb:serverfbml tag around them are listed on the XFBML wiki page.
Anyway, some code:
<fb:serverfbml style="width: 650px;">
<script type="text/fbml">
<fb:fbml>
<fb:request-form
action="http://my.app.com/invite/sent"
method="POST"
invite="true"
type="My App Name"
content="You should use My App Name. All the cool kids are doing it.
<fb:req-choice url='http://apps.facebook.com/my-app'
label='<?php
echo htmlspecialchars("That sounds sweet!",ENT_QUOTES);
?>'
/>
" >
<fb:multi-friend-selector
showborder="false"
actiontext="Invite your friends to use My App Name."
exclude_ids="1234556,465555"
rows="3"
/>
</fb:request-form>
</fb:fbml>
</script>
</fb:serverfbml>
Escaping quotes gets a bit tricky with all the nested tags, so you have to watch that. You can see my example is from a PHP app, and I left an htmlspecialchars() escape call in there just for illustrative purposes (even though that particular string doesn't need escaping).
Anyhow, if you've got Facebook Connect already installed for your IFrame app, then this should work with a bit of tweaking. If you don't have Facebook Connect going yet, then follow the Rendering XFBML instructions on the XFBML wiki page.