Question

I have added the facebook like button to my website. There’s a delay when the jscript below is loaded, and the rest of the page doesn’t load until it’s done. Also, if I block facebook with my firewall there’s a very long delay before it gives up, and THEN the rest of my page is displayed. How do I get my page displayed first, and then that like button? (I did that to see what would happen if facebook was having a problem.) Also, when I load different pages the facebook like button keeps reloading (it’s visibly absent until reloaded – 1/3 second.) The button is in the same place on every page, in a banner on top. The other images don’t reload – they are cached – and they appear static when selecting a different page. Is there a way I can make that script be cached?

Here’s the code:

<div style="position: absolute; top:20px; right:85px; width:70px; height:25px">
    <script type="text/javascript" src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
    <fb:like href="http://www.facebook.com/pages/somepage/somenum" layout="box_count" show_faces="false" width="50"></fb:like>
</div>

Thanks

UPDATE:
I found this code for loading all.js asynchronously:

“Another way is to load asynchronously so it does not block loading other elements of your page: ”

<div id="fb-root"></div><script>window.fbAsyncInit = function() {  
FB.init({appId: 'your 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>  

But what is “your app id?” That code is from here http://www.mohammedarif.com/?p=180

Answer 1

You can load asynchronously as I described in the update to the question. You get an app id from “create application” on facebook. (Google it…)