アシタノ！

明日つい話したくなる新鮮ニュースを紹介します。ちょっとだけ、明日が楽しくなりますように。

はてなスターをFC2ブログにつける方法

巷で大不評の「はて☆すた」こと「はてなスター」ですが
FC2ブログにも付けることができます。

画像を変更すると言う小技まで実現できたので
(↑でハートが表示されていると思います)、
その方法もメモとして残しておくことにします。

□予備知識
この「はて☆すた」ですが、デフォルトだとh3タグに寄生します。
記事タイトル部にh3タグが無い場合は一工夫必要です。

□初級
[条件]テンプレートの記事タイトル部がh3タグで囲まれている
例)
<h3>
<a href="<%topentry_link>" name="entry<%topentry_no>" id="entry<%topentry_no>"><%topentry_title> </a>
</h3>

⇒このような人はラッキーです。テンプレートの</head>の前あたりに

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

これ書いて終わり。

□中級
[条件]テンプレートの記事タイトル部がh3タグで囲まれていない人
例)h2タグで囲まれていることが結構あります
<h2>
<a href="<%topentry_link>" name="entry<%topentry_no>" id="entry<%topentry_no>"><%topentry_title> </a>
</h2>

⇒このような場合はh2タグに寄生するように設定を行います。
またもや</head>の直前あたりに

<script type="text/javascript" src="http://s.hatena.ne.jp/js/HatenaStar.js"></script>
<script type="text/javascript">
Hatena.Star.EntryLoader.headerTagAndClassName = ['h2',null];
</script>

これを記載します。
headerTagAndClassName～の部分でh2タグに寄生するように設定されます。

□上級
デフォルトでは「はて☆すた」は「☆＋」「☆」の画像が表示されますが、
この画像を独自のものに変更することができます。

現在変更が出来ることが確認できているのは

１．「☆」の画像
２．「☆＋」の画像
３．コメントが入力されていないときの吹き出し画像
４．コメントが入力されているときの吹き出し画像

この４つです。

あらかじめ表示したい画像を「ファイルアップロード」でＵＰしておき、

<script type="text/javascript" src="http://s.hatena.ne.jp/js/HatenaStar.js"></script>
<script type="text/javascript">
Hatena.Star.EntryLoader.headerTagAndClassName = ['h2',null];
Hatena.Star.Star.ImgSrc = '１の画像のパス';
Hatena.Star.AddButton.ImgSrc = '２の画像のパス';
Hatena.Star.CommentButton.ImgSrc = '３の画像のパス';
Hatena.Star.CommentButton.ImgSrcActive = '４の画像のパス';
</script>

と記載します。ちなみに上記１～４は

１．Hatena.Star.Star.ImgSrc
２．Hatena.Star.AddButton.ImgSrc
３．Hatena.Star.CommentButton.ImgSrc
４．Hatena.Star.CommentButton.ImgSrcActive

に相当します。

ちなみに画像の大きさによっては上手く表示できないものもあるかもしれません。
(表示時にリサイズしているようなので)
デフォルトの「はて☆すた」画像を参考にしながら作成すると良いと思います。

# はてなの人しか☆付けられないってどうなんでしょう。
# まぁ、１ヶ月後くらいには「FC2スター」とか出るんじゃないかとは思いますがね。

PR

[ 2007/07/13 02:46 ] TB(3) | CM(3)

≪今日のニュース 2007.07.15 | HOME | [お休み]今日のニュース 2007.07.13≫

ありがとうございます

この記事を見て、ようやくスター設置できました。
感謝します・・・。

[ 2008/08/23 19:00 ] [ 編集 ]

要点をおさえた素晴らしい記事です

ほかのたくさん星がついてるFC2ブログ全く役に立ちませんでした。このブログと他社のところを参考にしました。はてなの運営もスターつける読み手もアホじゃないかと…。自分でも確認しましたが、FC2テンプレの記事タイトルはやっぱり<h2>が多いですね。一発コピペで、はてなスター使えるように書いてあるこの記事すばらしいです。あなた天才

[ 2008/09/28 18:41 ] [ 編集 ]

有難うございました！

この記事を見て、無事スター設置できました。
有難うございました！

[ 2008/11/12 11:33 ] [ 編集 ]

コメントの投稿