はてなブックマークボタンの作成・設置について

さて、ボタンシリーズの続きです。はてなブックマークボタンはこのページからブログパーツが作れます。

​1. ボタンを設置するページの情報を入力

ブログのURLとタイトルを入力します（エントリー毎のブックマークボタンを設置する場合は別途修正が必要になります）。

​2. ボタンのタイプを選択

スタンダードボタン、バーティカルボタン、シンプルボタンの3種類からチョイス。

このブログに設置したのはバーティカルボタン。

​3. プレビューを確認。コードを貼り付けて完了

ちょっと長いコードですが、これをブログのテンプレートに貼り付けましょう。

各エントリーのブックマークボタンを設定をするには、その記事に対するパーマネントリンクのURLとタイトルを設定する必要があります。これは、それぞれhref属性とdata-hatena-bookmark-titleというdata属性に設定します。tumblrの場合は

<a href="http://b.hatena.ne.jp/entry/{Permalink}" class="hatena-bookmark-button" data-hatena-bookmark-title="{Title}" data-hatena-bookmark-layout="vertical" title="このエントリーをはてなブックマークに追加">

というように属性を修正すれば完成です。