Loading Facebook Like Likeページコンテンツの読み込み後のページ

Question

ページコンテンツが読み込まれる前にFacebook Like Boxの読み込みを遅らせようとしています。これをAJAX経由で実現しようとしていますが、私がしたのは、以下のコード（HTML5バージョン）を受け取りました：

<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=147395032005356"; 
    fjs.parentNode.insertBefore(js, fjs); 
}(document, 'script', 'facebook-jssdk'));</script> 

<div class="fb-like-box" data-href="http://www.facebook.com/platform" data-width="292" data-show-faces="true" data-stream="false" data-header="false"></div> 

...私のウェブサイトのどこかに座っていましたか？

Iその後、セットアップいくつかのjQueryコードを取得し、そのように、それをページに追加する：

いくつかの例では

// set 1 second timeout 
setTimeout(function() { 
    $.ajax({ 
     url: "/facebook/likebox.php", 
     success: function(data){ 

      // add loaded data to page 
      $('#foo').append(data); 
     } 
    }); 
}, 1000); 

（同じページにF5キーを押す）これが働いていたし、いくつかはそれはしませんでした。

私が達成しようとしているものに対して、より良い解決策があるのか​​、実際に何かを見過ごしてしまったのかどうか疑問に思っていました。

Answer 1

javascriptをfbAsyncInit（）コールバック関数に入れて、Facebook JavaScript SDKが完全な状態になっていることを確認してください。 likeboxのDOMを挿入した後にFB.XFBML.parse()に電話するのを忘れないでください

window.fbAsyncInit = function() { 
$.ajax({ 
    url: "/facebook/likebox.php", 
    success: function(data){ 

     // add loaded data to page 
     $('#foo').append(data); 
     FB.XFBML.parse($('#foo')[0]); 
    } 
}); 
};