I have a like button that works perfectly. But when i try to add callback to the like-box it wont trigger. I read on a stack topic that says its a bug(?) and i tried allot, but i cant find it out.
The code i use:
<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/nb_NO/all.js#xfbml=1&appId=163145893868097";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
And
<div class="fb-like-box" data-href="https://www.facebook.com/FacebookDevelopers" data-width="292" data-height="200" data-show-faces="true" data-stream="true" data-show-border="true" data-header="true"></div>
EDIT:
And the callback within the javascript code:
FB.Event.subscribe('edge.create',
function(response) {
alert('You liked the URL: ' + response);
}
);
You might want to check and track this bug on Facebook Developers:
https://developers.facebook.com/bugs/508219649233845
Related
I have included the code i needed to be able to show the facebook login button on my page. But the button does not show up, could you please read my code and tell me if you see any problems with it? Thank you
<!DOCTYPE html>
<html>
<body>
<script>
window.fbAsyncInit = function() {
FB.init({
vappId : '486506335043368',
autoLogAppEvents : true,
xfbml : true,
version : 'v2.10'
});
FB.AppEvents.logPageView();
};
(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 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/sdk.js#xfbml=1&version=v2.10&appId=486506335043368";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-login-button" data-max-rows="1" data-size="large" data- button-type="continue_with" data-show-faces="false" data-auto-logout- link="false" data-use-continue-as="false"></div>
</body>
</html>
I think there are 2 possible problems:
1)You need to change js.src assignment to: js.src="https://connect.facebook.net/en_US/all.js";
2)I think Facebook does not support calls from a local file, the script has to be run on a file with an http:// or https:// URI.
See this answer.
I have been having issues with the way in which my facebook send button works on my website, you can see an example at http://mysocialrewards.com.au/hellofresh-discount-code/
I was wondering if anyone could help me figure out why it's not displaying correctly, I've tried everything I can, code is below:
<div class="fb-send" data-href="https://www.hellofresh.com.au/food-boxes/classic-box/?c=FRESH118" data-size="large"></div>
<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_GB/sdk.js#xfbml=1&version=v2.7&appId=433230226813254";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
I need to execute javascript code after the facebook comments plugin is properly rendered on the page (basically I need to get the #content's height)
Comments placement somewhere in the content:
<div id="content">
<fb:comments href="http://domain.com/somelink.php" num_posts="25" width="728"></fb:comments>
</div>
Facebook init at the bottom of the page:
<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/sdk.js#xfbml=1&appId=<?=MY_FACEBOOK_APP_ID?>&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
I tried this:
FB.Event.subscribe("xfbml.render", function(response) {
console.log($('#content').height());
});
...but got this error:
Uncaught ReferenceError: FB is not defined
Any ideas? Thanks!
I've added the code that has worked in the past to add a facebook "like" button to my latest site yet, although it does display the Tweet button, it does not display the facebook button.
Is it because facebook doesn't recognize and/or support azure web sites?
Here is my HTML/Javascript:
<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";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div style="display:inline-block;vertical-align:top">
Tweet
<script>
!function (d, s, id) { var js, fjs = d.getElementsByTagName(s)[0], p = /^http:/.test(d.location) ? 'http' : 'https'; if (!d.getElementById(id)) { js = d.createElement(s); js.id = id; js.src = p + '://platform.twitter.com/widgets.js'; fjs.parentNode.insertBefore(js, fjs); } }(document, 'script', 'twitter-wjs');
</script>
</div>
<div style="display:inline-block;vertical-align:top" class="fb-like" data-href="http:/usamaporama.azurewebsites.net" data-send="false" data-width="450" data-show-faces="false" data-font="segoe ui"></div>
UPDATE
The Chrome Dev Tools console says: "FB.getLoginStatus() called before calling FB.init()." but I don't grok that, as searching my code for "getLoginStatus" finds nothing, nor does searching for "FB.init".
Check your browser's JavaScript console.
Invalid App Id: Must be a number or numeric string representing the application id.
Below script will downlaod the facebook sdk to generate the code to create the like button
(function() {
var scrFaceBook = document.createElement('script');
scrFaceBook.type = 'text/javascript';
scrFaceBook.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
scrFaceBook.async = true;
document.getElementById('fb-root').appendChild(scrFaceBook);
})();
<div class="fb-like" data-send="false" data-width="450" data-show-faces="true" data-font="arial"></div>
I am doing like this to add the FaceBook like button. When I run my application and see I get "object does not support this property or method, all.js, uri: https://connect.facebook.net/en_US/all.js"
Can some one suggest me how do I fix this? Thanks in advance.
You forgot to add the <div id="fb-root"></div> to the body of the HTML.
Also you seem to have forgotten the APP ID
<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=127211380649475";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
You need to make sure the dom element is declared above the script tag. Otherwise it might not load:
<div class="fb-like" data-send="false" data-width="450" data-show-faces="true" data-font="arial"></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=127211380649475";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
are your broswer support html5? maybe the error is here "scrFaceBook.async = true;"