ブログでよく見かける「↑B」ボタンと「B!」ボタンの設置方法です。
違いが分からなかったのですが、「↑B」はエントリーを含むページへのリンクで、「B!」はこのページをはてなブックマークに追加するという意味があるようです。
さて、そのはてなブックマークボタンを私のブログにも設置しようと調べたのですが、公式サイトでWordpressについてのマニュアルがないんです。
自分のブログに「↑B」「B!」アイコンを表示する
ただ、しくみとしてはそれほど難しくなかったので、Wordpressへの設定方法をメモしておきます。
「↑B」「B!」ボタン画像取得
2つの画像をダウンロードし、自身ブログのサーバにアップロードします。
http://b.hatena.ne.jp/images/append.gif
http://b.hatena.ne.jp/images/b_entry.gif
リンクを設置
例えば、このブログのトップページのエントリーを含むはてなへのリンクは以下のように設置します。
<a href="http://b.hatena.ne.jp/entry/https://helog.jp/"> <img src="b_entry.gif" width="16" height="12" style="border: none;" alt="このエントリーを含むはてなブックマーク" title="このエントリーを含むはてなブックマーク" /> </a>
つまり、各ページに以下のようなWordpressのコードを組み込めばよいのです。
<a href="http://b.hatena.ne.jp/entry/<?php the_permalink(); ?>"> <img src="b_entry.gif" width="16" height="12" style="border: none;" alt="このエントリーを含むはてなブックマーク" title="このエントリーを含むはてなブックマーク" /> </a>
同じようにして、この記事をはてなブックマークに追加するボタンは以下のように設置します。
<a href="http://b.hatena.ne.jp/entry/add/<?php the_permalink(); ?>"> <img src="append.gif" width="16" height="12" style="border: none;" alt="このエントリーをはてなブックマークに追加" title="このエントリーをはてなブックマークに追加" /> </a>
ブックマーク数「○○users」を表示する
こちらも、公式サイトにマニュアルが存在しますが、Wordpressの方法は記載されていません。
自分のブログに「○○users」を表示する
しかし、これも単純にリンクを設置してあげればよいだけです。
<a href="http://b.hatena.ne.jp/entry/<?php the_permalink(); ?>"> <img src="b_entry.gif" width="16" height="12" style="border: none;" alt="このエントリーを含むはてなブックマーク" title="このエントリーを含むはてなブックマーク" /> <img src="http://b.hatena.ne.jp/entry/image/<?php the_permalink(); ?>" alt="はてなブックマーク - <?php the_title(); ?>" title="はてなブックマーク - <?php the_title(); ?>"> </a>
実際に、ここの下に追加してみました。
今やスタンダードとなりつつある「はてなブックマーク」ボタン。ブログへの設置がまだの方は是非。
I was trying to daydream, but my mind kept wandering.
helog.jp is my TOP7 site!
iphone 5 news