2009年10月13日

Seesaaブログに「Twitterでつぶやく」ボタンを設置する方法

Seesaaブログのテンプレートに、独自変数とJavaScriptを使って「Twitterでつぶやく」ボタン(とついでにTwib で取得できるTweet数)を設置できるコードの解説。ただ大前提として、現在ではSeesaa標準の「ブックマーク機能」にまったく同じ機能が搭載されている。普通はこれを使えばいいので、あえて「別の場所につぶやくボタンを付けたい」とか「標準機能を何かの理由で使いたくない」という場合でないと使う意味がない点に注意。

貼り付けコード

<script type="text/javascript">
<!--
document.write('<a href="http://twitter.com/home?status=' + encodeURIComponent('<% article.subject | html %>') + '%20<% article.page_url %>" target="_blank" title="Twitterでつぶやく"><img src="http://blog.seesaa.jp/img/bookmark/twitter_ico.gif" alt="Twitterでつぶやく" width="16" height="16" border="0" /></a>'); 
// -->
</script>

ブラウザのJavaScriptがONで正常に機能している場合、以下のように表示されるはず。

「つぶやくときにタイトルはいらない。URIだけで十分」という場合ならJavaScriptは不要なので、noscriptの部分に以下のように入れておいてもいいかもしれない。(自分の環境ではやっていない。)

<a href="http://twitter.com/home?status=%20<% article.page_url %>%20" target="_blank" title="Twitterでつぶやく"><img src="http://blog.seesaa.jp/img/bookmark/twitter_ico.gif" alt="Twitterでつぶやく" width="16" height="16" border="0" /></a>

設置は「デザイン」→「コンテンツ」などから任意の場所に書き込めば機能するはず。

おまけのTwibのコード

TwibのAPIでTweet数が取得できるので、それにSeesaaの変数を入れただけのもの。上のものと組み合わせればこのBlogのように「つぶやくボタン + Tweet数」が表示可能に。設置例はページ下部で。

<a href="http://twib.jp/url/<% article.page_url %>" title="tweet" target="_blank" ><img src="http://image.twib.jp/counter/<% article.page_url %>" border="0" alt="" /></a>

「設置しても上手く表示されない」という場合は単にSeesaaの再構築が不完全なだけかもしれないので、「設定を反映する」や「ブログ設定の変更」を何度かクリックしてみるといいかもしれない。

posted by RPM at 20:27 | TrackBack(0) | BackLink | Web制作 | 更新情報をチェックする

この記事へのトラックバック

×

この広告は180日以上新しい記事の投稿がないブログに表示されております。