そういえば、最近Facebookのアプリをさっぱりさわらなくなりました…。あんなにハマっていたCityVilleも完全にノータッチのみはらです。
Facebookは、アプリしか見ていませんが、「いいね！」されると、なんかハッピーな気持ちになりますよね？だから、みはら.comにもFacebookの「LikeBox」を設置しているわけですが、このLikeBoxがどうも読み込みに時間がかかるんです。
もちろん、このLikeBoxだけでなく、いろんな理由からみはら.comは読み込みに時間がかかっているんですが、ひとつの作戦として、このLikeBoxを何秒かずらして読み込ませることで、サイトを開いてもらったときの重たさを軽減しようと思います。
時間をずらして読み込みを開始する方法
数秒後に作動するなんて、なんか、時限爆弾みたいですね。
参考（ほぼ全コピペ）にさせていただいたのがこちらの記事です。お世話になりました、ありがとうございます。
こちらの記事では、TwitterやらFacebookやらSNSのボタンたちを後から読み込ませることで、読み込みの体感速度を上げるっていうことでした。みはら.comでは、SNSボタンはプラグインを使って、記事トップに表示しているので、SNSボタンのほうは今回はちょっと放置します。
で、コードです。
まずは、LikeBoxを表示させるところにこれです。
HTML
<div id="iinebox"><!-- ここにLikeBoxが表示されます --></div>次に</body>の直前に書くやつです。
HTML
<script type="text/javascript">
// 最初に変数を定義
var facebook_likebox;
facebook_likebox =
'<div class="iine"><iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2F%E3%81%BF%E3%81%AF%E3%82%89com%2F313319718705646&width=300&height=290&colorscheme=light&show_faces=true&border_color=d9d9d9&stream=false&header=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:290px;" allowTransparency="true"></iframe></div>';
// 5秒後 <div id="iinebox"></div> の中に表示させる
setTimeout(function(){
$('#iinebox').append(facebook_likebox);
},5000);
</script>ちなみに、<div class=”iine”>はスタイルのためにくっつけただけです。
こんなカンジです。
みなさんもやってみてくださいね：）
