はてなスターを外部のブログサイトなどへ搭載する際に、サイトごとに☆を表示する場所などをカスタマイズする方法を変更します。
今回の変更により、CSSセレクタを使ったシンプルな設定で、☆を表示する場所、エントリーのURL、タイトルなどの場所を指定することができるようになります。
新しい設定方法は、以下のような書式となります。
<script type="text/javascript" src="http://s.hatena.ne.jp/js/HatenaStar.js"></script> <script type="text/javascript> Hatena.Star.SiteConfig = { entryNodes: { 'div.entry': { uri: 'h3 a.permalink', title: 'h3.title', container: 'h3.title' } } }; </script>
entryNodesの中に、1エントリーに対応した要素のセレクタを記述し、その中にURIが含まれるa要素(uri)、タイトルが含まれる要素(title)、☆を表示する要素(container)のセレクタをそれぞれ記述します。
この変更は、数日内に変更を行う予定です。これまでの設定方法でも基本的に動作するようになっていますが、あらかじめ正常に動作するかを以下のスクリプトを利用することでご確認いただけますので、外部のサイトではてなスターをお使いの方で、動作検証を事前に行われる場合はこちらで確認を行って頂ければと思います。
http://s.hatena.ne.jp/js/HatenaStar2.js
今回の変更により、サイトごとの設定をシンプルに行うことができるようにした上で、さまざまなウェブサイトに対応した設定を集約し、自動的に配信を行うなどの拡張を行っていきたいと考えています。
どうぞよろしくお願いします。