We Keep Coding

is it better to delay executing FB messenger js code using setTimeOut() to not block page rendering

when trying to analyse my page speed using Google page speed analytics.
I see that FB messenger load a lot of js files.
so, I decided to delay FB script using setTimeOut() method.
<!-- Load Facebook SDK for JavaScript -->
<div id="fb-root"></div>
<script defer>
jQuery(window).load(function(){
function load_fb_chat(){
window.fbAsyncInit = function() {
FB.init({
appId : 'myappid',
autoLogAppEvents : true,
xfbml : true,
version : 'v7.0'
});
};
(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/xfbml.customerchat.js';
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
};
window.setTimeout( load_fb_chat, 2000 ); //or 500ms
})
</script>
but I am not sure if it's a good practice.

Seeing "Uncaught ReferenceError: FB is not defined in console"

In a process of hiding piece of content for people who didn't like our page yet. Using Facebook SDK for the first time. The idea is to have a call to action text and button. Once button is clicked, if user already likes our page- it shows a piece of content. If not- shows a like button and shows piece of content after it's clicked.
Here is connecting SDK
window.fbAsyncInit = function() {
FB.init({
appId : '348511868693215',
xfbml : true,
version : 'v2.8'
});
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'));
And here is actual code for checking
FB.api({
method: "pages.isFan",
page_id: page_id,
}, function(response) {
console.log(response);
if(response){
//if liked
$(".show-poll").click(function(){
$(".actualpoll").show();
});
} else {
$(".show-poll").click(function(){
$(".likepage").show();
});
}
}
);

Your code "for checking" is executed before the SDK is loaded, i.e. before FB is available. Move the code inside the window.fbAsyncInit function. That function is called once the SDK is available.

how to simulate the click event on the facebook share button

I want to use jquery/js to simulate the click on original fb share button when I click my custom button.
This is what I've got:
<script>
$(function(){
// initialize fb sdk
window.fbAsyncInit = function() {
FB.init({
appId : '830561340319450',
xfbml : true,
version : 'v2.2'
});
};
(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="fb-share-button" data-href="www.myweb.com/topic/hello_world" data-layout="button"></div>
<button class="my_own">Lets share</button>
I want when I click on my_own, the facebook stock button also get clicked. Any idea how to do that?

Remove the Facebook share button. Trying to trigger a click on it is not the way to go; it might even trigger measures they have in place to prevent click-jacking, and as a result get your app blocked by FB.
Implement the call to the Share dialog when the user clicks your own button:
HTML:
<button class="my_own" type="button" onclick="share();">Lets share</button>
JavaScript:
function share() {
FB.ui({
method: 'share',
href: 'http://www.myweb.com/topic/hello_world',
}, function(response){});
}

where to place app id for javascript share for facebook

hello im having a small issue of where to exactly place the appID from facebook for the share function to work. I get the error. "The parameter app_id is required"
edit: sorry i forgot to mention how i want it to work. i need it to grab to the current url to share on facebook for multiple products.
EDIT2: reupdated the code but still am getting an error
<h4>SHARE THIS!</h4>
<div class="addthis_sharing_toolbox"></div>
<a class="social gp" href="#">google+</a>
<a class="social pt" href="#">pintrest</a>
<a class="social fb" id="fb" href="#" >facebook</a>
<script>
window.fbAsyncInit = function() {
FB.init({appId:'2**************', status: true, cookie: true, xfbml: true,});
};
</script>
<script>
document.getElementById('fb').onclick = function() {
FB.ui({
display: 'popup',
method: 'share',
href: 'window.location.href',
}, function(response){});
}
</script>
<a class="social tw" href="#">twitter</a>
<a class="social ig" href="#">instagram</a>

If you are just looking for the basic JavaScript SDK setup, it should go directly under the opening body tag (along with the snippet to asynchronously load the SDK) like so:
<body>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '{your-app-id}',
xfbml : true,
version : 'v2.0'
});
};
(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>
<!-- Your code here -->
</body>
Here's where it's described in their quickstart guide: https://developers.facebook.com/docs/javascript/quickstart/v2.1.
Then, later, you should just be able to use the share dialogue wherever you need it:
FB.ui({
method: 'share',
href: 'https://developers.facebook.com/docs/',
}, function(response){});
Here's where that's described: https://developers.facebook.com/docs/sharing/reference/share-dialog

Facebook App : Error in the execution of Javascript SDK

I just begin the facebook development, and I try to make the first app with javascript SDK.
However, when I go the page where I install the code, I have an error message saying that "does not work , try again later."
My application is in development mode and it's the good Appdata
In facebook dashboard I entered as domain: http://yofitness.fr
Someone have an idea ?
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '{624205284323943}',
status : true,
xfbml : true
});
FB.ui({
method: 'send',
name: 'People Argue Just to Win',
link: 'http://www.nytimes.com/2011/06/15/arts/people-argue-just-to-win-scholars-assert.html',
});
};
(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>
</body>

Change appId:'{624205284323943}', to appId: '624205284323943',