はてなスターを設置

はてなスターをブログに設置するにはを参考に、以下のコードをブログに貼り付ける。

• http://s.hatena.ne.jp/はてなID/blogs でブログを登録し表示されるコード
• はてなスター追加箇所を指定するためのコード

ウチのブログの場合以下のようなコード。

<script type="text/javascript" src="http://s.hatena.ne.jp/js/HatenaStar.js"></script>

Hatena.Star.Token = 'トークン';
Hatena.Star.SiteConfig = {
	entryNodes: {
		'article > header': {
			uri: 'h1 a',
			title: 'h1',
			container: 'h1'
		}
	}
};

AutoPagerize(+AutoPatchWork)への対応

継ぎ足しされるノードをHatena.Star.EntryLoader.loadNewEntries()に渡すイベントリスナーをwindow.addEventListener()で登録する。

注意点として、Hatena.Star.SiteConfig.entryNodesで指定したセレクタに、継ぎ足しされるノードが含まれる場合、継ぎ足しされるノードからのセレクタに修正する必要がある。

ウチのブログの場合、継ぎ足しされるノードがarticle要素なので、以下のようにセレクタからarticle要素を取り除いて対応した。

var StarConfig = Hatena.Star.SiteConfig.entryNodes;
var InsertNode = function(evt) {
	Hatena.Star.SiteConfig.entryNodes = {
		'> header': StarConfig['article > header']
	};
	Hatena.Star.EntryLoader.loadNewEntries(evt.target);
};
window.addEventListener('AutoPagerize_DOMNodeInserted', InsertNode, false);
window.addEventListener('AutoPatchWork.DOMNodeInserted', InsertNode, false);

これで継ぎ足しされた部分にも、はてなスターが追加されます。

あと、リスナーの登録にAutoPagerize_DOMNodeInsertedを使っているので、AutoPagerize 0.40以降でないと動作しません。

参考: AutoPagerizeで継ぎ足された部分に自分のスクリプトを適用する方法あれこれ - 0xFF

最後に

はてなスターの連打はキケンです！