タグ: WordPress

はてなスターを設置しようとして，普通にやってもうまくいかなかったのでメモとしてまとめました．一応これではてなスターが表示されるようになりました．

はてなスターから取ってくるもの

はてなスターのページにログインし，[外部のブログサイトを登録する]にURLをいれると表示されるものをコピーしてくる．以下のようなもの．ただし，*********…の部分はURLによって異なる．

<script type="text/javascript" src="http://s.hatena.ne.jp/js/HatenaStar.js"></script>
<script type="text/javascript">
Hatena.Star.Token = '********************************';
</script>

これを，自分の[外観]→[テーマ編集]のheader.phpの</title>の次あたりに貼りつけておく．
これだけでうまくはてなスターが表示されるようになることもあるが，使用しているテンプレートによっては，はてなスターが表示されない場合がある．

自分のブログのスタイルに合わせた設定

Hatena.Star.EntryLoader.headerTagAndClassNameに，[タグ名,クラス名]をセットすることで，そのタグで囲まれた部分の後ろにはてなスターが設置される．タグ名=h1，クラス名=entry-titleの場合次のようになる．これをheader.phpに貼り付ける．

<script type="text/javascript">
Hatena.Star.EntryLoader.headerTagAndClassName = ['h1','entry-title'];
</script>

この場合，

<h1 class='entry-title'><a href='記事のパーマリンク'>記事のタイトル</a></h1>

の後ろにはてなスターが設置される．自分のブログがこういう形式になってない場合は、記事のスタイルを編集する必要がある．エントリのタイトルは<?php the_title(); ?>で、パーマリンクは<?php the_permalink(); ?>で取得できるので，例えば，

<h1><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1>

というふうに設定しておけば良い．この設定をするのは，[外観]→[テーマ編集]の，loop.phpとsingle.php．loop.phpは，複数エントリを表示する画面で，single.phpは，単一のエントリを表示する画面．
loop.phpとsingle.phpで，エントリのタイトルを囲むタグが異なる場合は，上記Hatena.Star.EntryLoader.headerTagAndClassNameの設定を，header.phpではなく，loop.phpとsingle.phpの一番上にそれぞれ設定を変えて貼り付ける．