はてなダイアリーに各種RSSリーダーの購読ボタンをつける

ふと、はてなダイアリーにGoogle ReaderでRSSを購読するボタンとかをつけたくなりました。
今どきRSSがそんなに使われているかもわからないのですが、つけておいて損はないのでつけてみたくなりました。
検索したけどやり方が見当たらなかったので、同じことをやりたい誰かのために書いておきます。

こんな感じにサイドバーにRSS購読ボタンを表示します。
以下、やり方です。
はてなダイアリーの管理画面で「デザイン」＞「ページのフッタ」の<div class="sidebar">の中に以下のコードを書きます。
[はてなID]は自分のはてなIDに書き換えてください。
[RSSアイコンのURL]は適当なRSSアイコンをフォトライフにでもアップロードしてください。面倒ならimgタグごと消してください。

<div class="hatena-module" id="subscribe-rss">
    <div class="hatena-moduletitle"><a href="http://d.hatena.ne.jp/[はてなID]/rss" target="_blank"><img src="[RSSアイコンのURL]" width="20" align="left">RSSリーダーに登録</a></div>
    <div class="hatena-modulebody">
      <div class="rss-readers">
      <a target="_blank" href="http://fusion.google.com/add?feedurl=http%3A%2F%2Fd.hatena.ne.jp%2F[はてなID]%2Frss"><img alt="Add to Google" src="http://buttons.googlesyndication.com/fusion/add.gif" align="absmiddle" border="0" height="17" width="104"></a><br>
      <a target="_blank" href="http://reader.livedoor.com/subscribe/http://d.hatena.ne.jp/[はてなID]/rss" title="Subscribe with livedoor Reader"><img alt="Subscribe with livedoor Reader" src="http://image.reader.livedoor.com/img/banner/91_17_1.gif" align="absmiddle" border="0" height="17" width="91"></a><br>
      <a target="_blank" href="http://www.bloglines.com/sub/http://d.hatena.ne.jp/[はてなID]/rss"><img alt="Bloglinesで閲読登録" src="http://www.bloglines.com/images/sub_modern11.gif" align="absmiddle" border="0"></a><br>
      <a target="_blank" href="http://r.hatena.ne.jp/append/http://d.hatena.ne.jp/[はてなID]/rss"><img alt="ADD TO Hatena::RSS" src="http://r.hatena.ne.jp/images/addto_s.gif" title="ADD TO Hatena::RSS" align="absmiddle"></a><br>
      <a target="_blank" href="http://add.my.yahoo.co.jp/rss?url=http%3A%2F%2Fd.hatena.ne.jp%2F[はてなID]%2Frss" title="My Yahoo!に追加"><img alt="My Yahoo!に追加" src="http://i.yimg.jp/i/jp/my/addtomy1.gif" align="middle" border="0" height="17" width="91"></a><br>
      <a target="_blank" href="http://fastladder.com/subscribe/http://d.hatena.ne.jp/[はてなID]/rss" title="Subscribe with Fastladder"><img alt="Subscribe with Fastladder" src="http://image.fastladder.com/img/banner/80_15.gif" border="0" height="15" width="80"></a><br>
      </div>
    </div>
</div>

普段ボタンは非表示にしておいてマウスオーバーで表示するようにするには「スタイルシート」のところに以下のCSSを書いてください。

#subscribe-rss .rss-readers{
  display:none;
  *display:block; /*IEだとdivのhoverが効かないので*/
}
#subscribe-rss:hover .rss-readers{
  display:block;
}

終わり。