Hatena starを付けてみる　その２スター

前のエントリーHatena starを付けてみるで、はてなスターをつけてみたところ、更に良い方法があるということをはてなスターのお返事で教えてもらいました。

TREND SPOTTINGさんのMovable Type4にはてなスターを設置2なのですが、このとおりに設置してみると、あらま上手く行っています（こちらのサイトでテストしてみた）。

似たようなことをやったけれども、上手く行かなかった、、と思いましたが、"ブログ記事の詳細"と"ブログ記事の概要"両方にspanを付けなかったからかな。。前回方法では、二つのヘッダーのテンプレートを作るため、ヘッダーの内容を変える時に両方ともやらなければいけないので、こちらの方法に変えていこうと思います。

方法のメモ

１．はてなスターにアクセス。ログインして右上のBlogsをクリック。

２．"外部のブログサイトを登録する"にblogのURLを入れ、追加する。

３．トークンが発行される。出てきたHTMLコードをコピーする。
MovableTypeの管理画面より、
　デザイン＞テンプレート＞クイックフィルタ　テンプレートモジュール＞ヘッダー
のheadタグの中に、コピーしたコードをペーストする。

４．トップページのタイトルの横に設置させるために、Hatena.Star.EntryLoader.header...以下の一行を加え、保存。以下のものがheadタグ内に加えられた。

<script type="text/javascript" src="http://s.hatena.ne.jp/js/HatenaStar.js"></script> 　　<script type="text/javascript"> Hatena.Star.EntryLoader.headerTagAndClassName = ['span','star']; Hatena.Star.Token = 'your トークン'; 　　</script>

５．　デザイン＞テンプレート＞テンプレートモジュール＞ブログ記事の詳細
の、"ブログ記事のメタデータ"のモジュールインクルードの上にある、

<h1 id="page-title" class="asset-name entry-title"><$MTEntryTitle$></h1>

<h1 id="page-title" class="asset-name entry-title"><$MTEntryTitle$><span class="star"><a href="<$MTEntryPermalink$>" class="hidden">スター</a></span></h1>

６．　デザイン＞テンプレート＞テンプレートモジュール＞ブログ記事の概要
の、"ブログ記事のメタデータ"のモジュールインクルードの上にある、

<h2 class="asset-name entry-title"><a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a></h2>

<h2 class="asset-name entry-title"><a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a><span class="star"><a href="<$MTEntryPermalink$>" class="hidden">スター</a></span></h2>

７．再構築して、出てくるか確認。

TREND SPOTTINGさん、ありがとうございました。