Facebook「Share」ボタンで0件でもバルーンを表示する方法


 

【!追記 – facebookのFB.Shareのバージョンアップに伴い以下の方法は使用できなくなりました。】

 


Facebook「Share」ボタンはデフォルトだと投稿が0の時は、数字のバルーンが表示されません。


だから↑のようなデザインの時はバルーンが表示されないと見映えば悪いのです。
投稿が0件の時でも、Facebook “Share”ボタンも数字が0と表示されるようにしましょう。


基本の設置コードは↓です。

<a name="fb_share" type="box_count" share_url="{URL}" href="http://www.facebook.com/sharer.php?u={URL}&t={タイトル}">Share</a>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>

   

ここでjavascriptをfacebookからダウンロードしてしまいます。
http://static.ak.fbcdn.net/connect.php/js/FB.Share

   

ダウンロードしたFB.Shareの下記のコードを検索して、変更します。
【修正前】

this.displayBox(a,3);

【修正後】

this.displayBox(a,0);

   

修正したら自分のサーバーにFB.Shareをアップして下さい。
設置コードも↓のように変更します。

<a name="fb_share" type="box_count" share_url="{URL}" href="http://www.facebook.com/sharer.php?u={URL}&t={タイトル}">Share</a>
<script src="{サーバーにアップした「FB.Share」までのURL}" type="text/javascript"></script>

   


無事に0件でも表示されました。

なお、自前のサーバーにアップしたので、facebookで仕様の変更があった時にはその都度変更しないといけなくなるので注意です。

以上です!

この記事を書いた人:

ナカシマ

北区赤羽在住のWEBデザイナー兼エンジニア。インターネット、WordPress、本・漫画、音楽が大好き。妻と猫と暮らすアップル信者。

BLOG: 着ぐるみ追い剥ぎペンギン