Any guide of how to make something in which when a user logs into my site using Facebook, it automatically can post a status using their Facebook account saying something like "John just joined mysite.com" so all their friends would see. Anything like that?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Facebook post</title>
</head>
<body onload="publishWallPost('{{ page.slug }}')">
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'Your Super Cool 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>
<script>
<!--
function publishWallPost(slug) {
var attachment = {'name':'My Super Cool Website','description':'This is a test of the Facebook Broadcast System. If this was real, you would be reading something useful.','media':[{'type':'image','src':'http://MySuperCoolWebsite.com/images/facebook_image.png','href':'http://www.MySuperCoolWebsite.com/' + slug + '/'}]};
FB.ui({
method: 'stream.publish',
message: 'I just found this Super Cool Website!',
attachment: attachment,
user_message_prompt: 'post this to your wall?'
});
}
//-->
</script>
</body>
</html>
Related
I googled for nearly 4 hours and am posting this.
I am trying to implement facebook login in my website.
The problem is login is working fine, after login it has to redirect to anther custom page,
its not redirecting but staying in the same page. Here is my code that am using.
<head>
<title>My Facebook Login Page</title>
<script src="//connect.facebook.net/en_US/all.js"></script>
</head>
<body>
<div id="fb-root"></div>
<fb:login-button perms="email"></fb:login-button>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'XXXXXXXXXX',
status : true,
cookie : true,
xfbml : true
});
FB.Event.subscribe('auth.login', function() {
window.location = "about_us.html";
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
<!-- <div class="fb-login-button" >Login with Facebook</div> -->
Kindly guide me where am wrong also if possible correct code
I had taken the code from below link.
Redirect after clicking on the Facebook login button, even if already logged in Facebook
Thanks in advance.
you can just add this somewhere
FB.login(function(response) {
if (response.authResponse) {
window.top.location = "http://www.foo.com";
}
});
When I put
window.top.location = "http://www.foo.com";
under
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
window.top.location = "";
});
it worked.
I'm creating a fanpage on facebook, when the page loads I m getting error because of FB.getLoginStatus.
b is null [Break On This Error] FB.provide('',{ui:function(f,b){f=FB.c...onent(FB.UIServer._resultToken));}});
b is null
http://connect.facebook.net/en_US/all.js
Line 22
all.js FB.provide('',{ui:function(f,b){f=FB.copy({}.....
I'm really confused why I'm getting b is null, check my current code.
<!doctype html>
<html xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title><?php echo APP_NAME; ?></title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'xxxxxxx',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true
});
//FB.UIServer.setLoadedNode = function (a, b){FB.UIServer._loadedNodes[a.id] = b; }
FB.getLoginStatus(function(response) {
if (!response.session) {
FB.login(friendsGet);
}
else
{
friendsGet(response);
}
});
};
(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);
}());
thanks
I get the error as well and as ElbertF writes, it's because the browser blocks the pop up window.
Only way to get over this is to let the user do an action and then call FB.Login. Let him click something - anything.
Why is facebook even using popups?? Totally old school.
/Rune
I've been trying to tackle this since last week and for the life of me I cannot seem to get this working on safari, all other browsers render the popup except Safari.
It seems straight forward enough, load up the javascript-sdk asynchronously, initiate it, and call FB.ui with method 'stream.publish'. The thing is I know this code should work in safari cause the example here does http://fbrell.com/fb.ui/stream.share.
I'm using this P3P header which we use that fixes a problem with IE7:
Response.AddHeader("P3P", "CP=\"NON DSP COR DEVa PSAa IVAo CONo OUR IND UNI PUR NAV DEM LOC\", " + "policyref=\"http://sweepstakes.mars.com/w3c/p3p.xml\"");
I'm hoping someone could offer the magic tip that's gonna get this working. Here's my code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml">
<head id="Head1" runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
</head>
<body>
<div id="fb-root">
</div>
<script>
window.fbAsyncInit = function (){
FB.init({ appId: '<%= Common.appID %>', status: true, cookie: true,
xfbml: true
});
var publish = {
method: 'stream.publish',
message: 'test',
display: 'dialog'
};
FB.ui(publish);
};
(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>
</body>
</html>
After many tests and frustrations. A colleague pointed out that 'feed' is the new way of doing 'stream.publish'. This fixed the issue.
Edit: Outdated answer.
I have several Facebook like buttons on myself that are being rendered via XFBML. After clicking on them, they appear to work in that they change from the standard like button into the "thumbs up" icon that says "You like this". However, after a second or two (I assume the time it takes to hit FB's servers and come back), it automatically unlikes itself, turning back into the original like button.
See a video of what I mean here.
My code is pretty standard:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" lang="en">
...
<fb:like href="http://www.example.com/valid/path" layout="button_count" ref="recipe_preview" />
...
<script type="text/javascript">
window.fbAsyncInitExt = function() {
FB.Event.subscribe('edge.create', function(response) {
alert('Facebook Like Button: ' + response);
});
};
</script>
...
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({
appId: 'XXXXXXXXXX', // my app ID is here
status: true,
cookie: true,
xfbml: true
});
if (typeof(fbAsyncInitExt) == 'function') {
fbAsyncInitExt();
}
};
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
})();
</script>
Edit: For what it's worth, I also attempted to see if Facebook was sending any log info, but it didn't appear to be:
<script type="text/javascript">
window.fbAsyncInitExt = function() {
FB.Event.subscribe('edge.create', function(response) {
alert('Facebook Like Button: ' + response);
console.debug(response);
});
FB.Event.subscribe('fb.log', function(response) {
alert('LOG: ' + response);
console.debug(response);
});
};
</script>
After a lot of digging, I finally discovered the source of the error. It turns out the page referenced by the href value in my fb:like tag required at least one of the fb:app_id or fb:admins META tags in the HEAD. For reference: http://developers.facebook.com/docs/opengraph
After trying all of the solutions I could find, none work, but I tried using the "Live feed" app ID rather than the default "Live Stream" when you're getting your code from the facebook developers page, which worked for me.
I've created a facebook connect application, iframe. I'm using it under apps.facebook.com/app-name.
It seems that after a refresh, the setSize() method simply fails. sometimes works, sometimes doesn't... (under latest Firefox and IE) is there a solution for that? would you recommend using the old API instead?
testcase:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>test</title>
<meta name="description" content="test">
</head>
<body>
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: 'XXXXXXXXX', status: true, cookie: true, xfbml: true});
FB.Canvas.setSize({ width:760,height:3000 });
};
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
<div style="height:2000px;background:blue;width:760px;">
</div>
</body>
</html>
if for some reason window.name is set the FB.setAutoSize wont work, http://bugs.developers.facebook.net/show_bug.cgi?id=19720 in my case its connected somehow to jquery $.data
window.fbAsyncInit=function(){
FB.Canvas.setSize = function(b) {
if (typeof b!="object")
b={};
b=b||{};
if (b.width==null||b.height==null)
b=FB.copy(b,FB.Canvas._computeContentSize());
b=FB.copy(b,{frame:'iframe_canvas'});
if (FB.Canvas._lastSize[b.frame]) {
var a=FB.Canvas._lastSize[b.frame].height
if(FB.Canvas._lastSize[b.frame].width==b.width&&(b.height<=a&& (Math.abs(a-b.height)<=16)))
return false;
}
FB.Canvas._lastSize[b.frame]=b;FB.Arbiter.inform('setSize',b);
return true;
}
FB.init({
appId:"<?php echo FB_APP_ID; ?>",
status:true,
cookie:true,
xfbml:true
});
FB.Canvas.setAutoResize()
};