新bloggerにはてなブックマークボタンを表示させてみた

かねてより、「ソーシャルブックマークに追加」ボタンを付けたいと思っていて、まず手始めにはてなブックマークのヘルプサイトを参考にやってみたのだが、そもそも「<!-- Begin #main --> と <!-- End .post --> に囲まれた以下の部分」というのが見つからない。無理矢理にコードを貼ってみるが、何度やってもテンプレートを保存する時に下記のようなエラーが出る。

XML エラー メッセージ: The value of attribute "expr:href" associated with an element type "a" must not contain the '<' character.

htmlとcssの基礎知識しかない私にとって、このエラーが一体何を意味しているのか全くわからなかったので、とりあえず検索してみると、日頃からお世話になっているクリボウさんのBlogger Tipsの新Bloggerテンプレートのエラーメッセージ一覧がヒットした。

なるほどどうやら<a href="http://b.hatena.ne.jp/entry/<$BlogItemPermalinkUrl$>">の中に<$BlogItemPermalinkUrl$>が入っているのが問題なようだということはわかったが、ではどうしたらいいのか。

いろいろと調べていくうちに、

・はてなブックマークのヘルプサイトは旧Bloggerテンプレート用である

・新Bloggerテンプレートは旧Bloggerと全く異なる記述法で書かれている。

ということがわかったので、新Bloggerにしぼって検索するとzikiteさんのBlogger Beta Tipsに最も欲しかった情報がまさにそのままあったので、この通りにしてCSSを少々いじって完成。

やれやれ、現在デフォルトテンプレートを使っているが、いずれ自作テンプレートに変えてやるという密かな野望とは裏腹に、旧Bloggerと新Bloggerのテンプレートの仕組みの違いも知らなかったとは情けない限りである。

----
Acknowledgement :

クリボウ様、zikite様、ありがとうございました。ド素人ではありますがこれからも勉強させていただきます。また調べている過程でSu-san様の苦労話も大変参考になりました。ありがとうございました。

----
Reference :

Blogger ヘルプ

クリボウのBlogger Tips

Blogger Beta Tips

Dummies Guide to Google Blogger beta : Error Messages in New Blogger Templates.