2010.11.28 追記
新しくなった、はてなブックマークボタンの設置方法は、「Amebloに貼り付けていた、はてなブックマークボタンを更新してみたよ 」にまとめています。そちらもあわせてどうぞ。
前回「Amebaで、はてなブックマークボタン配置するためのブログパーツ書いたよ 」で、このAmebloにはてなブックマーク登録ボタンと、はてブ数を表示するためのJavaScriptを書いてみましたが、「最近の記事一覧 」の方にも表示できそうなので改良してみました。
※ 前回同様にはてブがついていない記事には、登録ユーザー数は表示されません。
改良版ブログパーツ用のJavaScript
前回同様に、特に貼り付けるにあたってカスタマイズしなくても問題ありません。
<script>
$(document).ready(function(){
var page_url = location.href;
if (page_url.match(/^.+\/entrylist[\-0-9]*\.html$/g )) {
var entries = $(".newentrytitle a");
var classname = ".updatetime";
} else {
var entries = $(".foot a:contains('記事URL')");
var classname = "div.entry .theme";
}
for (i = 0; i < entries.length; i++) {
var url = entries[i];
var hatena_btn = '<a href="http://b.hatena.ne.jp/append?' + url + '" target="blank"><img height="12" width="16" border="0" alt="はてなブックマークに追加" src="http://b.hatena.ne.jp/images/append.gif " /></a> <a href="http://b.hatena.ne.jp/entry/' + url + '" target="blank"><img border="0" src="http://b.hatena.ne.jp/entry/image/' + url + '" /></a>';
$(classname).eq(i).append(' <span>' + hatena_btn + '</span>');
}
})
</script>
簡単に解説すると、最初にページのURL（page_url）を取得して、それが最近の記事一覧（URLがentrylist.htmlまたはentrylist-X.html ※ Xは数字）のものかを識別しています。
次にそのページ内の記事のパーマネントリンクが書かれたアンカータグから、URLを取り出し後は出力したい位置にはてなブックマークボタンと登録ユーザー数のイメージを出力しています。
最近の記事一覧のページには、はてなブックマークボタンは要らないかなと思いましたが、AmebloのJavaScriptを貼り付けられるフリープラグインが3800文字以内という制限があるため、ソースを簡略化するために同じ処理にしました。
「Amebaで、はてなブックマークボタン配置するためのブログパーツ書いたよ 」に書いたように、出力位置を変えたい場合は、変えたい位置のクラス名を「classname」変数内に指定すれば位置を変更することもできます。
利用に際しては、特に制限ないのでご自由にどうぞ！
2010.02.25追記
「Amebaで任意の位置に自動でタグを挿入するブログパーツ書いたよ 」に書いたように、AmebaではjQueryがデフォルトで利用可能なので、GoogleにホストされているｊQueryを読み込む必要はありません。
[PR]
[PR]
関連記事
Amebaに「なうで紹介」と「mixiチェック」ボタンを追加してみたよ
Amebloに貼り付けていた、はてなブックマークボタンを更新してみたよ
Amebloに設置していたツイートボタンをTwitter公式のものに変えました
ReTweet数を表示できるTopsyブログパーツをAmebloに張ってみたよ
[jQuery] 外部JavaScriptファイル読込みに関する考察
GO2WEB20のTwitterバッチをAmebloにつけてみた。と、IE対策方法
Amebaで任意の位置に自動でタグを挿入するブログパーツ書いたよ