はてなブックマークボタンをブログに設置したいとき
さて、ボタンシリーズの続きです。はてなブックマークボタンはこのページからブログパーツが作れます。
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="このエントリーをはてなブックマークに追加">
というように属性を修正すれば完成です。