ページ

▼

2012/01/17

Bloggerの人気の投稿にTweet＆はてブカウンターを表示させる方法

右の画像のように人気の投稿にTweetカウンターと
はてブカウンターが表示されていたら、
どれくらい人気なのかわかりやすくていいですね。
見に来てくれた人も人気の具合がわかって便利ですし、
凄く人気ならその記事に興味を示してくれるかもしれません。

ということでBloggerの人気の投稿をカスタマイズしましょう。

Blogger設定画面
↓
テンプレート
↓
HTMLの編集
↓
ウィジェットのテンプレートを展開にチェック
↓
エディタなどで popular-posts を検索
↓
人気の投稿で選択されている設定によって４パターンに分かれます。
  1. 抜粋/サムネイルなし
  2. 抜粋のみ
  3. サムネイルのみ
  4. 抜粋/サムネイル両方
しかし、やることは基本的には全て同じです。
自分の設定に当てはまるパターンを探して、このリンクタグを見つけます。
<a expr:href='data:post.href'><data:post.title/></a>
上のリンクタグの直後に以下のコードを追加します。
<div class='item-counter'>
<a expr:href='"http://tweetbuzz.jp/redirect?url=" + data:post.href'><img expr:src='"http://tools.tweetbuzz.jp/imgcount?url=" + data:post.href'/></a>
<a expr:href='"http://b.hatena.ne.jp/entry/" + data:post.href'> <img alt='はてブ' expr:src='"http://b.hatena.ne.jp/entry/image/" + data:post.href'/></a>
</div>
後はお好みで item-counter クラスのCSSを指定してください。

関連リンク
TweetBuzz - Tweetカウンター
はてなブックマーク ＞ ヘルプ ＞ 自分のブログに「○○users」を表示する