公式ツイートボタン - 初めてのシステムと日記

twitterの公式ツイートボタンが(だいぶ経ちますが)リリースされてたので使い方をメモです。

■どういうボタンになるか

垂直方向へカウント数表示、水平方向へカウント数表示、カウント数表示

上記3つのパターンがあります。つぶやいた回数が簡単に集計できるのは便利そうです。

■ソースを見てみる

垂直方向へカウント数表示のソースは以下のようになっています。

<a href="http://twitter.com/share" class="twitter-share-button" 
data-url="http://d.hatena.ne.jp/boss_sato/20100830/" 
data-text="[Twitter]公式ツイートボタン - 初めてのシステムと日記" 
data-count="vertical" data-lang="ja">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

各パラメーターの意味は以下のとおり。

・data-url

リンク先を指定。指定がなければボタンが表示されているページのURLが入る。

・data-text

つぶやく内容を指定。指定がなければボタンが表示されているページのタイトルが入る。

・data-count

つぶやいた回数の表示形式を指定。指定方法は以下の3つ。
・vertical:垂直方向に表示
・horizontal:水平方向に表示
・none:表示しない

・data-lang

言語を指定。jaが日本語。

つぶやく内容やリンク先を動的にしたい場合は、上記パラメーターをいじれば対応できます。

■改善したいこと

おそらくいつか対応されると思うのですが、ボタンの画像が公式のものしか使えなさそうなところが

実際サイトで使う際、デザインとかで浮いてしまうのでは感じます。

たぶん

http://platform.twitter.com/widgets.js

を見る限りこのjsをローカルに持ってきて中身をごにょごにょすれば出来る気配がするので

時間あるときに試してみたいです。

※2010/08/31追記

ボタンの画像を自由に出来ないかとwidgets.jsの中身をごにょごにょしてみましたが、

結果から言うと出来ない気配がしました。。

http://platform0.twitter.com/widgets/tweet_button.html

ここのURLにパラメーターを渡して内部的に処理をしているっぽいので、

たぶん画像を自由に表示するにはwidgets.jsをそれなりに書き換えないと出来ない気配がしました。

なのでおとなしく公式で対応するのを待ちます。。