Recently I have been doing a lot of work with Facebook apps, and occasionally I came across issues such as this one with the FBML (Facebook Markup Language) and FBJS (Facebook JavaScript) where they seemed very difficult or impossible to do. I was trying to make a simple popup with my FBML application (note not Iframe applicaiton) and the popup using the fb:dialog element is not adjustable in its size, so instead of attempting to adjust that I change the row count of the invitation form, which was almost there. Then by removing the border it was only 2 pixels out so I did a little CSS hack using negative margins. By making the above modifications to the original code example I got from the facebook wikipedia page I have managed to make an easy to modify friend invitation code correctly using Facebooks FBML. If anyone has any issues with the below FBML then let me know, This first part is the file which actually displays the facebook multiple friend invitation form for facebook applications anf facebook connect:
1 2 3 4 5 6 7 8 9 10 11 12 |
<div style="margin-left:-5px;"> <fb:request-form type="The app name" invite="true" method="POST" action="http://apps.facebook.com/appurl" content="[inviteContent]"> <fb:multi-friend-selector actiontext="Some action text here for the friends invited" showborder="false" rows="3" cols="3" /> </fb:request-form> </div> |
As you can see the above shows the fb:request-form necessary to contain the fb:multi-friend-selector, but the most important three parts of this code is the amount of cols, the div containing, and the showborder attribute. With this specific combination the facebook multiple friend invite form fits perfectly inside the facebook dialog popup. For those who don't know, the below code shows you how to put this into a dialog, and a link which will launch the dialog (facebook popup) containing the multiple friend invitiation form.
1 |
<a href="#" title="Invite friends" class="btnInviteFriends" |
Mvinaymurthy
Posted at 2011-10-14 18:18:33
i have tried the below code but iam getting errors( Given URL is not allowed by the Application configuration.) can any body get me out of the errors ...
========================================================================
Pick a friend:
">
var channel_path = "/xd_receiver.htm";
var fbApiKey = '218698911527026'; /// true API key goes here
FB_RequireFeatures(["XFBML"], function() {
FB.XFBML.Host.autoParseDomTree = false;
FB.init(fbApiKey, "/xd_receiver.htm");
FB.ensureInit(function() {
FB.Facebook.apiClient.get_sessionWaitable().waitUntilReady(function(fbSession) {
var element = document.getElementById('friendPickerContents');
FB.XFBML.Host.parseDomElement(element);
});
});
});
</script>
</body>
</html>"
Mvinaymurthy
Posted at 2011-10-14 16:14:19
i have tried the above code but i dont see any dialog...can u please send it with complete code....
Akhil
Posted at 2011-09-15 08:18:55
Do you know why would the dialog not pop up? The fb:login-button works ..but not the fb:dialog ???
I event tried your example but the dialog never pop's up !!!
I am using something like this ..
My Little Dialog
Do you like my little dialog?
Would you like to see a dialog?
Anonymous
Posted at 2011-07-05 19:54:25
:oops: :sad: :eek: :zzz :P :roll: :sigh: :D :lol: :-) ;-) 8) :-| :-* :oops: :sad: :cry: :o :-? :-x
Andy Sharman
Posted at 2011-05-15 16:16:46
Hi Daniel,
FBML is no longer used so this isn't the best way, however, if you wish to you can use the FBJS SDK and it will render it how necessary.
You can see an example here:
FB.init({
appId : '',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
Anonymous
Posted at 2011-05-12 02:01:42
Thanx for the article i still have problems connecting with my site the button is visible from my site but its not connecting to facebook
Anonymous
Posted at 2011-05-12 02:00:19
I'm still having issues connecting facebook and my site. Any help will be highly appreciated
Anonymous
Posted at 2011-03-29 18:01:44
Thanks for sharing. I'm a newer to use facebook api. When use fb tag in a web page, which script file should I import?
Andy Sharman
Posted at 2011-03-28 00:52:33
Invite limit is made by Facebook, the more popular your application the more invites a user will be allowed.
All content & designs are copyrighted to udjamaflip.com 2009-2011.
Mvinaymurthy
Posted at 2011-10-14 18:24:01
this is the code i have tried...... but i dont see any thing positive can any body help me...
Pick a friend:
">
var channel_path = "/xd_receiver.htm";
var fbApiKey = '218698911527026'; /// true API key goes here
FB_RequireFeatures(["XFBML"], function() {
FB.XFBML.Host.autoParseDomTree = false;
FB.init(fbApiKey, "/xd_receiver.htm");
FB.ensureInit(function() {
FB.Facebook.apiClient.get_sessionWaitable().waitUntilReady(function(fbSession) {
var element = document.getElementById('friendPickerContents');
FB.XFBML.Host.parseDomElement(element);
});
});
});
</script>"
Reply to comment