I've been adding the following code to my site in order to create a facebook share button.
<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=1417490015165574";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-share-button" data-href="http://www.hazemagazine.co.uk/example-of-sharer- 2" data-type="button_count"></div>
In there my app id is 1417490015165574 - when i click on the share button though the app id in the URL is different. Here's an example http://www.hazemagazine.co.uk/example-of-sharer-2
I'm not the most technically competent person so any help would be most appreciated!!
use FB.init
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '{your-app-id}',
status : true,
xfbml : true
});
};
(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>
Related
i am trying to implement facebook like button to my jade page
but it displays nothing and i have no idea why
could someone explain me why?
here is code
div.row
div.form-group
div.col-md-3
#fb-root
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 = "https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v3.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
// Your like button code
.fb-like(data-href='http://fsa.kg/', data-layout='standard', data-action='like', data-show-faces='true')
Here is html code
<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 = 'https://connect.facebook.net/ru_RU/sdk.js#xfbml=1&version=v3.2';
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="http://fsa.kg/" data-layout="box_count" data-action="like" data-size="small" data-show-faces="true" data-share="false"></div>
Can you use the Facebook send button functionality (https://developers.facebook.com/docs/plugins/send-button) without an appid?
The example from the Facebook seems to work without an APP_ID
<body>
<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.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-send" data-href="http://www.bbc.co.uk" data-colorscheme="light"></div>
</body>
but didn't want the button to suddenly stop working if this is required!
I think it's needed because the example shown when clicking the "Get Code" button in the link you provided seems to require it.
<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=1530164767244635&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
I'd recommend using an app_id. Did you try using it without an app_id on your site?
I've looked at the other post on here for issue's with Facebook like button not showing up and can't seem to figure out why in the world the Facebook like button I am trying to add is not showing up. I've followed the steps on the FB developer page but still not showing. Here is my code. Is there something wrong that I am not seeing or doing?
<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=1402069220010998";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="http://www.winvipconcert.com"data-width="350" data-show-faces="false" data-send="false"></div>
Your code works fine for me on chrome and firefox. My guess is this is a styling issue. Check the styles of the container that wraps the div.fb-like
Try the following, there is little difference between your code but see if it works.
<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 = "http://connect.facebook.net/en_US/all.js#xfbml=1&appId=1402069220010998";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<script>
(function(d, debug){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/ar_AR/all.js#xfbml=1&appId=356233997758493";
ref.parentNode.insertBefore(js, ref);
}(document, /*debug*/ false));
</script>
That's how I init facebook sdk, the problem is when I load the page for the first time any code inside window.fbAsyncInit doesn't load, but when I refresh the page it works fine.
Do you have any idea what the problem may be?
I resolved this by moving my Facebook's SDK snippet to the very bottom of my index file, just before the closing </body> tag.
...
<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";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
</body>
You can work around this by using window.onload to wrap any functions you want performed on page load. Might not be pretty, but it works.
<script>
//Executes on page load
window.onload = function(){
window.fbAsyncInit = function(){
//Init stuff
};
FB.getLoginStatus(function(response) {
//...
};
};
// Load the SDK asynchronously
(function(d){
//stuff
}(document));
</script>
How do I display the text of the I like button in a different language with HTML5 script?
When you initialize fb-jssdk
<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>
change js.src url to your locale
Go to http://developers.facebook.com/docs/reference/plugins/like/ and search for "How do I display the Like button in different languages?"