I will implement a functionality that let users to invite their facebook friends (explicity choosing or let exclude some of them) to our site (I dont know what is possible with facebook api but possible cases: 1- sending plain email to friends 2- facebook message, invitation in facebook platform). I am facebook platform newbie and dont know where to start. Could you recommend which API should I use (facebook connect , facebook graph etc)? I read that facebook api and permission is changing rapidly. What is the state of the art way of doing this task?
You have to create one facebook app first.
Heres the link for creating facebook app.
https://www.facebook.com/developers/createapp.php
Then after put the following code in your application.
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
//Your app details here
FB.init({appId: 'your-app-id', status: true, cookie: true, xfbml: true});
};
//Load the SDK asynchronously
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
<fb:serverfbml>
<script type="text/fbml">
<fb:fbml>
<fb:request-form
action="url-after-inviting"
method="POST"
invite="true"
type="Name of site"
content="Text you want to keep along.
<fb:req-choice url='link-to-your-website'
label='<?php echo htmlspecialchars("Invite Now!",ENT_QUOTES); ?>'/>"
>
<fb:multi-friend-selector
showborder="false"
actiontext="title-text"
exclude_ids="<?php //echo $excludeIds; ?>"
rows="3"
/>
</fb:request-form>
</fb:fbml>
</script>
</fb:serverfbml>
Related
Is the Facebook JavaScript SDK something I download and upload to my server? Or is it something I just call from my own JS?
I am looking at their documentation here:
http://developers.facebook.com/docs/reference/javascript/
But got confused half way through :)
The Facebook JavaScript SDK is ran on the client's system (aka the web browser). The SDK is hosted at Facebook and you only need to include it with <script src='http://connect.facebook.net/en_US/all.js'></script>. You don't need to upload it to your server.
You use the SDK from JavaScript client-side.
If it's XFBML that you find confusing: it is translated to HTML and CSS client-side by the JavaScript SDK.
There's no need to upload the JavaScript SDK to your server (unless you want to stick to a particular version). If you want you can just reference the one served by Facebook as you would any other script:
<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>
Or you can load it asyncronously:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'your app id', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
I have the Facebook invite feature on a site that I am working on and all of a sudden it stopped working. Here is what I have:
window.fbAsyncInit = function() {
FB.init({ appId: '145554402127660', status: true, cookie: true, xfbml: true });
};
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<fb:serverFbml width="565px">
<script type="text/fbml">
<fb:fbml>
<fb:request-form method='POST' invite=true
type='Our site'
action='http://somesite.com/step3'
content='this is the place you want to be'>
<fb:multi-friend-selector cols=3
actiontext="Invite your friends to join you our site"
/>
</fb:request-form>
</fb:fbml>
</script>
</fb:serverFbml>
This worked before, but now for some reason I always get this error:
1 XFBML tags failed to render in 30000ms.
Any ideas on what is happening and why this stopped all of a sudden? Also, if there is a new way of doing this, maybe with the Graph API, I would highly appreciate info about it.
got namespace xmlns:fb="http://www.facebook.com/2008/fbml" ?
the answer is here - Facebook FXBML since Yesterday not rendering (IFRAME Canvas)
You'll have to call FB.XFBML.parse after FB.init is complete.
The newest way of doing this is through the Requests 2.0 Dialog, part of the Graph API. It's about 2 months "old". It works through the javascript API.
http://developers.facebook.com/docs/reference/dialogs/requests/
http://developers.facebook.com/blog/post/464
Is there anyone knows the step by step how to make a Facebook "Invite Friends Page"... In the official page i can't find any clear explanation about this... And also they said that fbml will be deprecated after 2010... So, how will the Facebook "Invite Friends Page" run after 2010?...
If you mean invite friends from a website outside of FB you do it with JS:
From the facebook developers website
Something like this should work:
FB.init({
appId : 'YOUR_APP_ID',
frictionlessRequests: true,
});
function sendRequestViaMultiFriendSelector() {
FB.ui({method: 'apprequests',
message: 'My Great Request',
}, requestCallback);
}
ok then use this
<fb:serverFbml width="760px">
<script type="text/fbml">
<fb:fbml>
<fb:request-form
action='http://apps.facebook.com/yoursite/'
method='POST'
type='photo fun'
content="Let's fun with facebook
<fb:req-choice url='http://www.yoursite.com' label='Register'/>"
<fb:multi-friend-selector actiontext="Select your friends."></fb:multi-friend-selector>
</fb:request-form>
</fb:fbml>
</script>
</fb:serverFbml>
Although this is in fbml but facebook is providing still support. As for as i know facebook has not provided any kind of replacement still. So enjoy it to use
i am using FB Connect on my site and i am able get & store offline access session key in DB.
My question, i need to display the multiple friend selector form even if there is no FB connect session.
How can i force it to resume/create the session i have in DB, so i can display friends in the below form.
Since i already got extended permissions, I must not ask them for login again. please help
require_once 'config.php';
$user = "1294712371";
$session = "827466297c301f2cc6b581ce-1294712371";
?>
<fb:serverfbml style="align:center;">
<script type="text/fbml">
<fb:fbml>
<fb:request-form
action="test.php"
method="POST"
invite="true"
type="dot.com"
content="Come and join me"
<fb:req-choice url='see wiki page for fb:req-choice for details'
label='Join Me' />
<fb:multi-friend-selector showborder="false"
actiontext="Invite your friends">
</fb:request-form>
</fb:fbml>
</script>
</fb:serverfbml>
<script src="JS/FeatureLoader.js" type="text/javascript"></script>
<script type="text/javascript">
FB_RequireFeatures(["XFBML"], function()
{
FB.init('appapikey', "xd_receiver.htm");
});
</script>
Currently the above code shows no friends at all when there is no FB connect loggedin sesstion
You could use set_user method from the php client library
$facebook = new Facebook(API_KEY, API_SECRET);
$facebook->set_user($user, $session);
I'm trying to use Facebook's fb:friend-selector FBML tag, but my application is running in an iframe. Is it possible to use this tag in an iframe? If so does anyone have any examples?
Yes, this is definitely possible, but you have to use Facebook Connect and XFBML. Specifically, you want to use the fb:serverfbml tag to get fb:friend-selector working. I have an iframe app whereby I use all of this and the fb:friend-selector in the standard "invite friends to your app" context, and it works great.
Here is the body of my template file, which gets output inside the body of my iframe:
<fb:serverfbml style="width: 650px;">
<script type="text/fbml">
<fb:fbml>
<fb:request-form
action="http://example.com/invite/sent"
method="POST"
invite="true"
type="My App"
content="Try out my app!
<fb:req-choice url='http://your-facebook-canvas-url'
label='<?php echo htmlspecialchars("Accept button text",ENT_QUOTES); ?>'
/>
" >
<fb:multi-friend-selector
showborder="false"
actiontext="Invite your friends to try My App."
exclude_ids="<?php echo $excludeIds; ?>"
rows="3"
/>
</fb:request-form>
</fb:fbml>
</script>
</fb:serverfbml>
In the footer of the page, I have the standard Facebook Connect code, which will load and render the fb:serverfbml contents:
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>
<script type="text/javascript">
FB_RequireFeatures(
["CanvasUtil"],
function(){
FB.XdComm.Server.init('/xd_receiver.html');
FB.CanvasClient.startTimerToSizeToContent();
}
);
</script>
<script type="text/javascript">
FB_RequireFeatures(["XFBML"], function(){ FB.Facebook.init("Your Facebook API Key", "/xd_receiver.html"); });
</script>
That should be all you need (fill in your own options where applicable, of course). You'll have to set up Facebook Connect to work with a cross-domain receiver file. I suggest following the rendering XFBML steps.
The question in this thread is still relevant but the answer is out of date. You should use the new javascript SDK. This should replace the second code snippet posted by zombat
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
FB.init({appId: 'your app id',
status: true,
cookie: true,
xfbml: true});
FB.Event.subscribe('auth.sessionChange', function(response) {
if (response.session) {
// A user has logged in, and a new cookie has been saved
} else {
// The user has logged out
}
});
</script>
more info here: http://www.clickonchris.com/2010/11/facebook-javascript-sdks/
Since that are a lot of questions about the friend-selector within an iframe.
Guys the correct sintax now is <fb:serverfbml width="650px">
one MAJOR and IMPORTANT point that gets missed is that many of you (including me) stick in scripts just about anywhere... but the "FB" load.js file needs to be loaded IMMEDIATELY after the body tag.
at least this is what I found to make everything work and humm accordingly. I found it on a post on some other site (wasn't sure if I should post it here or not...) but it came after spending countless hours, doing the above aforementioned - as well as following every other 1,2, 3 step punch into getting the iframe to size properly...
and now i've gotten it to work :)