2010年11月28日日曜日

Bloggerではてな、livedoor、Yahooブックマークボタンと被ブックマーク数を追加する


このエントリーをはてなブックマークに追加


前回の記事の拡張で様々なソーシャルサイトへのブックマークボタンと、被ブックマーク数の表示をさせる。

前回>> Bloggerではてなの被ブックマーク数を表示

デザイン → HTMLの編集 → 「ウィジェットのテンプレートを展開」にチェックを入れて編集する。

赤字部分を追記
-------------------------------------------
<b:if cond='data:post.title'>
  <h3 class='post-title entry-title'>
 <b:if cond='data:post.link'>
   <a expr:href='data:post.link'><data:post.title/></a>
 <b:else/>
    <b:if cond='data:post.url'>
      <a expr:href='data:post.url'><data:post.title/></a>
        <!-- はてなブックマークボタン-->
        <a expr:href='"http://b.hatena.ne.jp/append?" + data:post.url' target='_new'><img alt='このエントリーをはてなブックマークに追加' src='http://b.hatena.ne.jp/images/append.gif' style='border: none; padding: 0px;' title='このエントリーをはてなブックマークに追加'/></a>
        <!-- このエントリーを含むはてなブックマーク -->
        <a expr:href='"http://b.hatena.ne.jp/entry/" + data:post.url' target='_new'><img alt='このエントリーを含むはてなブックマーク' expr:src='"http://b.hatena.ne.jp/entry/image/" + data:post.url' style='border: none; padding: 0px;' title='このエントリーを含むはてなブックマーク'/></a>
        <!-- Livedoorクリップボタン-->
        <a expr:href='"http://clip.livedoor.com/clip/add?link=" + data:post.url + "&title=" + data:post.title' target='_new' title='このエントリをlivedoorクリップに追加'><img alt='このエントリをlivedoorクリップに追加' src='http://parts.blog.livedoor.jp/img/cmn/clip_16_12_w.gif' style='border: none; padding: 0px;'/></a>
        <!-- このエントリーを含むLivedoorクリップ -->
        <a expr:href='"http://clip.livedoor.com/page/" + data:post.url' target='_blank'><img expr:src='"http://image.clip.livedoor.com/counter/small/" + data:post.url' style='border: none; padding: 0px;'/></a> 
        <!-- Yahoo!ブックマークボタン-->
        <a expr:href='"http://bookmarks.yahoo.co.jp/action/bookmark?t="+ data:post.title + "&u=" + data:post.url' target='_new'><img alt='Yahoo!ブックマークに登録' height='16' src='http://i.yimg.jp/images/sicons/ybm16.gif' style='border: none; padding: 0px;' title='Yahoo!ブックマークに登録' width='16'/></a>
        <!-- このエントリーを含むYahoo!ブックマーク -->
        <a expr:href='"http://bookmarks.yahoo.co.jp/url/"+ data:post.url' target='_new'><img expr:src='"http://num.bookmarks.yahoo.co.jp/image/small/"+ data:post.url' style='border: none; padding: 0px; height:12px'/></a>
    <b:else/>
      <data:post.title/>
    </b:if>
 </b:if>
  </h3>
</b:if>
-------------------------------------------
参考>> Bloggerにブックマーク(はてな、Livedoor、Yahoo)のボタンをつける

2010/11/30 追記
青字部分は、動的に情報を生成する部分で、元サイトが重くなると表示が不安定になるのでいったん外した。