Facebookのいいね!／シェア／コメント数を別々に表示する（その2）

昨日、当ブログにFacebookのいいね／シェア／コメントの数を別々に表示する機能を追加したことをご紹介しました。
この機能をjQueryのプラグインにまとめましたので、それを公開します。

1.準備

プラグインは以下からダウンロードすることができます。

ダウンロードしたファイルを、ご自分のサーバーにアップロードします。
そして、このプラグインを使いたいWebページに以下のような行を追加して、jQueryとこのプラグインを読み込みます。
「・・・」は、jQuery／プラグインのアップロード先に応じて書き換えます。

<script type="text/javascript" src="http://・・・/jquery.js"></script>
<script type="text/javascript" src="http://・・・/jquery.fjfblikecount.js"></script>

次に、このプラグインを使いたいWebページで、HTMLを書き換えて、いいね!等の数を表示できるようにします。

まず、表示先の箇所に空のdiv要素を1つ入れます。div要素にはid属性を付けて、IDを指定します。
例えば、IDが「fb_count」というdiv要素にいいね!等の数を表示するなら、表示先の箇所に以下のdiv要素を入れます。

<div id="fb_count"></div>

そして、ページの読み込みが終わった後で、div要素にいいね!等の数が表示されるようにするために、以下のJavaScriptを追加します。

jQuery(document).ready(function() {
    jQuery('#div要素のID').fjFBLikeCount();
});

例えば、上の例のように、div要素のIDを「fb_count」にした場合だと、以下のJavaScriptを追加します。

jQuery(document).ready(function() {
    jQuery('#fb_count').fjFBLikeCount();
});

これで、「いいね : ○○, シェア : ○○, コメント : ○○, 合計 : ○○」のように、いいね!／シェア／コメントの数が表示されます。