前回の記事では、プラグイン内で tweetbuzz 提供のAPIを使ってツイート数を表示させてましたが、カウントが不正確なようですので Topsy の API で表示させる事にしました。
今度も API を使うのですが、JSON 利用 ですのでプラグイン内には記載せず、Nucleus のテンプレート等に javascript を記載していく形を取りました。変更箇所は下記になります。
（1）NP_TwitterButton のツイート数表示はコメント化。
詳細は、こちらの記事の追記部分を参照してください。
（2）ページ head 部分に、js 呼び出し用の記述を行う。
<script type="text/javascript" src="http://cdn.topsy.com/topsy.js?init=topsyWidgetCreator"></script>
Topsy の API を呼び出しますので、上記内容をページの head タグに記載しておきます。
（3）ページ内でツイート数を表示させたいところに、下記内容を記述。
<span class="topsy_widget_data"><!--
{
"url": "http://www.takehana.tv/cccc/index.php?itemid=<%itemid%>",
"theme": "blue",
"style": "small",
"order": "count",
"nick": "takehana_masaki"
}
--></span>&
Nucleus テンプレートに上記内容を記載しました。今回は TwitterButton の右にツイート数だけを表示したいので、パラメータ order に count のみを指定しています。もし retweet,count,badge と指定すれば、一番左にリツイート用のボタン、といった並べ替えての表示も可能です。
（4）CSS で指定を変更。
.topsy_widget_data {
display:inline-block;
margin: 0px 0px -5px 5px;
}
改行させないようにしたり、ツイートボタンから少し離して表示させたり、といった指定を CSS に追加しています。
（5）余談
設定自体は上記までで完了していますが、補足事項を書いておきます。
今回の Topsy のブログパーツを使えば、実はツイート用のボタンも簡単に設置できます。しかし日本語での文字化けが起こるケースがあったりしましたので、ツイートボタンだけは NP_TwitterButton で文字化けを避けるように別に処理させているわけです。
特異なサイト名とかじゃなければ、普通にブログパーツ貼り付けで問題ない気がします。
コメント