I had a page with a simple Facebook like button and I needed to know when the user liked the page so I used the edge.create event to do this which all worked fine. I now need to add a like Box plugin to the page to like the client's facebook page and again I need to be notified when someone clicks the like button. However, the subscribe event never fires. Any idea what might be the problem? I am using the xfbml code to add the like box.
It appears to be a bug. Here's a link to official credible sources:
http://developers.facebook.com/bugs/310763168934515
And my jsFiddle here to demonstrate: http://jsfiddle.net/dmcs/3D2GD/1/
EDIT
I've found the solution!
First I put my code onto my own domain rather than jsFiddle to do better testing, however my first try failed as if the code was still on jsFiddle. So I troubleshot the situation further.
Then for the app setting I specified I went in and specified the WebSite url on https://developers.facebook.com/apps/{APP_ID}/summary
Here's my code
<html>
<head>
<title>Like Box example</title>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId: '{APP_ID}'
});
FB.Event.subscribe('edge.create', function(response) {
alert('You liked the URL: ' + response);
});
};
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id; //js.async = true;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId={APP_ID}";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div class="fb-like-box" data-href="http://www.facebook.com/Cocacola" data-width="292" data-show-faces="true" data-stream="true" data-header="true"></div>
</body>
</html>
just need to replace code:
<div class="fb-like-box" data-href="http://www.facebook.com/jsfiddle"
data-width="292" data-show-faces="true" data-stream="false" data-header="true">
with this one :
<fb:like-box href="http://www.facebook.com/jsfiddle"
colorscheme="light" show_faces="false" header="false" stream="false"
show_border="false"></fb:like-box>
and it works ok.
Related
Good morning!
I've been testing the Facebook like button by default and I got a recurring error, I've followed the example code from the official site and tried the 2 options, iframe and the other, with booth I got the same error
<html>
<head>
</head>
<body>
<h1>button1</h1>
<iframe src="https://www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2Fnoudiari.es&width=93&layout=box_count&action=like&size=large&show_faces=false&share=false&height=65&appId" width="93" height="65" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>
<h1>button2</h1>
<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/es_ES/sdk.js#xfbml=1&version=v2.7&appId=YOURAPPID";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="https://www.facebook.com/noudiari.es" data-layout="box_count" data-action="like" data-size="large" data-show-faces="false" data-share="false"></div>
</body>
</html>
Any help with this?
Thanks guys!
it seems to work for me. Do you have a sample of the page you are using it on ?
It looks like due to all my attempts facebook blocked my account, I tried with another and worked fine.
Thanks
It seems I'm unable to moderate the Facebook comments of the Facebook comments plug-in.
Bellow the code that we initialy created. As you can see an appId is associated with it. Also, if you vist the page (http://amstelveenz.nl/armageddon/) there is one Facebook comment.
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function () {
FB.init({
appId: '1389836761336596',
xfbml: true,
version: 'v2.3'
});
};
(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/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div class="facebook-comments">
<!-- facebook comments -->
<div class="fb-comments" data-href="<?php echo get_permalink(); ?>" data-width="100%" data-numposts="5" data-colorscheme="light"></div>
<!-- einde facebook comments -->
</div>
When visiting https://developers.facebook.com/tools/comments to manage the comments I'm unable to the comments made on the website.
Also when visiting the page I don't see the moderator view.
The solution I came across quite often was to add the following lines:
<meta property="fb:app_id" content="1389836761336596"/>
<meta property="fb:admins" content="712359589"/>
Ofcourse with my app_id and user_id. This also didn't result in a solution.
Any suggestions?
You need to specify fb:admins on your site to tell us who should be able to admin the comments
Here is the page where I have Google Plus, Twitter and Facebook sharing enabled. You can try and see the behavior:
https://www.famometer.com/usatoday
Twitter sharing button works like a charm, but having major nightmares making g+ and fb like button to work.
First issue:
When Like button is clicked, it shows comment dialogue for a sec and then on subsequent clicks just keeps on flickering, does not allow to share. I tried with FF to look for any javascript errors or such but no errors are seen.
Here is the code:
Right after the <h:body> I have this Java Script code:
Namespace used: xmlns:fb="http://ogp.me/ns/fb#"
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '489611804432300',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
oauth : true, // enable OAuth 2.0
xfbml : true // parse XFBML
});
// All your canvas and getLogin stuff here
//
};
(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";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
and then in the viewAd.xhtml, I have this code:
<fb:like id="fbLike" href="https://www.famometer.com/usatoday" send="false" width="100" show_faces="false" layout="button_count" action="like" style="top:-3px"></fb:like>
I have done everything by the book, but still not working properly. If I am not logged in to FaceBook, the dialogue pops to sign in, but after signing in, the popup keeps flickering every time the like button is clicked. Can someone shed some light what is wrong in its implementation.
Second issue is with g+ button
It is not populating the url, title and description provided by microdata structure.
Here is the code:
Namespace used: xmlns:g="http://base.google.com/ns/1.0"
<div itemscope="itemscope" itemtype="http://schema.org/Product">
<span style="font-weight: bolder; font-size: 20px;" itemprop="name">#{adBB.business.businessName}</span><br/>
<span style="font-weight: bolder; color:gray;" itemprop="description">#{adBB.business.description}</span>
<h:panelGrid>
... some code here...
<g:plusone href="https://www.famometer.com/#{adBB.business.socialMedia.famometer}" size="medium" count="false"></g:plusone>
... some code here
</h:panelGrid>
</div>
Here is JavaScript - asynchronous one at the bottom of the page.
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
I have tried everything but it still reads info from meta tags and not from microdata tags.
Truly appreciate your help in solving these issues.
Thanks,
Sundeep
While the markup appears fine at a glance, the testing tool is not finding your schema.org values. I see the result of that by the share snippet preview not being accurate.
The issue with the dialog might be related to the redirects that you have in place. These should normally be okay. Is there a way you can test without the redirect? Like using https://www.famometer.com/views/viewAd.xhtml?ad=usatoday to test?
Is it possible to send notification to facebook application admins when comments are
posted using facebook social comments plugin?
Comment plugin is set up this way:
<meta property="fb:admins" content="111,222,333" />
<meta property="fb:app_id" content="123456789" />
<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&appId=123456789";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div class="fb-comments" data-href="http://example.com" data-num-posts="2" data-width="470" notify="true"></div>
<script>
window.fbAsyncInit = function(){
FB.Event.subscribe('comment.create', function(response){
alert(response);
});
};
</script>
Event subscribe works pretty good in this example(shows response alert), but is it possible to send notification to application administrators?
Your help would be appreciated.
I set up a simple PHP script to email me whenever a comment is posted. The PHP is like this:
<?php
mail('me#example.com','facebook_notification.php',
'Comment activity on http://example.com'.$_GET['path']);
and this JavaScript passes the URL of the comment page to the PHP script:
FB.Event.subscribe('comment.create', function(response){
var dummyImage = new Image;
dummyImage.src = 'http://example.com/facebook_notification.php?path='+response.href.replace('http://','');
});
I can easily add more addresses if I need to.
<body>
<script>
// Facebook Init
window.fbAsyncInit = function() {
FB.init({
appId : '...MYID...', // App ID
channelUrl : 'channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code here
FB.Event.subscribe('edge.create',
function(response) {
alert('You liked the URL: ' + response);
}
);
};
</script>
<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/de_DE/all.js#xfbml=1&appId=...MYID...";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div id="player"></div>
<div id="main">
<div id="facebook" style="height:30px;">
<div class="fb-like" data-href="http://www.MYURL.com/about" data-send="true" data-width="450" data-show-faces="true"></div>
</div>
Can somebody help? I am php programmer myself and just stuck with JS... I also considered the Php api, but actually it used to work, now it hangs all of sudden.. not sure what I did :(
Thanks!
Please see the Facebook developer site. It would be a good place to track as this is possibly not you. I'm having the same issue and I'm using FBML tags and not iFrame or HTML5.
https://developers.facebook.com/bugs/347759798609016
Something else to try is to try logging in, kill that window, then refresh the page. For me at least the "Like" button works after the refresh. So the login is successful, but the response from Facebook isn't.