ブログの記事一覧などに、はてなブックマーク数を表示させる方法

ブログの記事一覧などに、はてなブックマーク数を表示させる方法

ブログの記事一覧などに、はてなブックマーク数を表示させる方法

色んなブログを見ていると、人気記事とか関連記事の一覧に、はてなブックマーク数が表示されているのをよく見かけます。

記事のはてブ数を表示させるには、ブックマーク数を画像で取得するAPIを使えば簡単に実装することができます。

はてブ数を表示する方法

具体的には、以下のようなコードを読み込むことではてブ数を画像で取得します。

<img src="http://b.hatena.ne.jp/entry/image/記事のURL">

例えば当ブログの場合、以下のように指定します。

<img src="http://b.hatena.ne.jp/entry/image/https://techmemo.biz">

この API は、該当記事のはてなブックマークのエントリーページをリンクすることが前提として提供されています。なので、当ブログではてブ数を表示させたい場合は、以下のように指定しなければいけません。

<a href="http://b.hatena.ne.jp/entry/https://techmemo.biz"><img src="http://b.hatena.ne.jp/entry/image/https://techmemo.biz"></a>

WP-PostViews の人気記事一覧にはてブ数を追加する方法

一例として、当ブログでも利用している WP-PostViews の人気記事一覧にはてブ数を表示させる方法をご紹介いたします。

WP-PostViews のデフォルトの表示コードは以下のようになっていると思います。

<li><a href="%POST_URL%"  title="%POST_TITLE%">%POST_TITLE%</a> - %VIEW_COUNT% views</li>

例えば、表示回数の代わりにはてブ数を表示させたい場合は、[設定] – [Post Views] で「Most Viewed Template」を以下のように変更します。


<li><a href="%POST_URL%"  title="%POST_TITLE%">%POST_TITLE%</a> - <a href="http://b.hatena.ne.jp/entry/%POST_URL%"><img src="http://b.hatena.ne.jp/entry/image/%POST_URL%"></a></li>

このように変更することで、WP-PostViews の人気記事一覧にはてブ数が表示されます。

はてブ数の表示

あとがき

とても簡単にはてブ数を取得できるので便利ですね。

運営しているブログがある程度はてブを獲得できるようになってきたら、はてブ数を表示させることでクリック率上昇に繋がると思います。はてなブックマークのユーザーからしてみたら、はてブ数が多い記事は気になりますからね。

ぜひ導入してみてください。

この記事が気に入ったら
いいね!してね♪

Twitter で

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です