【B】10分ではてなブログに「他にこんな記事も読まれています」を表示する簡単な方法！の巻

たとえば、ずらーっと並んだレストランの中から、一店だけ選んで
ご飯を食べるとき。どうやって選ぶでしょうか？
数多くのウェブサイトがあるなかで、自分のブログを選んで、読んでもらうことって
似たようなことだと思うのです。

• 食べログにある他の人の評価で選ぶのと同じように
  はてブのブックマークされた数で選ぶ、とか
• お店の雰囲気で選ぶのと同じように
  ブログのデザインで選ぶ、とか
• 店頭にある見本で料理の内容を確認するように
  記事の内容が面白そうか確認してから選ぶ、とか

過去にご紹介させていただいた記事は、これらの中でも
デザインに関することだったり、記事の内容をチラ見せすることだったり
いかに「選んでいただくか」という点を良くしていくための内容でした。

今回は、「選んでいただいた」あとで、
いっぱい注文してもらう(＝他の記事もあわせて読んでもらう)ための
カンタンな方法をご紹介できればと思います。

店主としては、一品でも多くの品を頼んで頂いた方が嬉しいもの。
「本日の定食 (＝最新のエントリ)」だけじゃなくて
時間のある方にはサイドメニュー(＝他の記事)も
食べていっていただきたいものです。

しかし、深夜食堂じゃあるまいし、メニューが見つけられないことには
注文のしようがありません。

あったかいごはんにかつぶしのっけて
おしょうゆかけてたべたいんだけど。
(深夜食堂 第3夜 猫まんま より)

なんて、ちょっと憂いのあるお客さんがメニューを聞いてくる店じゃないのです。
ウチの店は。

深夜食堂 1 (ビッグコミックススペシャル)

サイドバーなんて見えちゃいない

もちろん、はてなブログをカスタマイズしなくても
他の記事へのリンクはサイドバーにあります。

しかし、そんなモノはほとんどの人にとって
のぞみに乗りながら三河安城の駅のホームにあるメニューを見るがごとし、です。
時速270キロで周辺視野を通過していってしまうのです。

←ほら、いま、ちょうどこの記事の左側を新着記事の一覧が通過しつつあります。

他の記事を確実に紹介するための方法

他の記事も見て頂くためには、その存在をしっかりと知って貰う必要があります。
お客様がランチを食べ終えたら、すかさずデザートメニューを試食とともに
オススメするくらい、アグレッシブにいきましょう。

そう、記事を読み終えた直後の、確実に目に付くところに
他の記事へのリンクを設置するのです。
やり方はめちゃめちゃカンタン。10分もあれば十分です！
(…前置きが長くなってごめんなさい。
この時点ですでに2分くらい経過してますね…。)

LinkWithinを使えばカンタンなのだ

ようやく本題にやってきました。
まずは、LinkWithinのサイトに向かいましょう。

さっそく、必要な情報を入力していきます。(下図参照)

 

メールアドレスとブログのURLを入力したら、
Platformは”Others”に変更(※はてなブログの場合)、
Width(＝ヨコ方向にいくつの記事を表示するか)を適当に選択します。

そして表示されたコードをコピーします。

あとは、はてなブログの管理画面でそのコードを貼り付けて
ちょいちょいっと修正するだけ。

はてなブログ管理画面から、記事下のHTMLを表示する画面にいきましょう。

「HTML記述欄」に先ほどコピーしたコードを貼り付けます。
その際、以下の赤字部分を追記します。

<script>
var linkwithin_site_id = XXXXXXX;
linkwithin_text='他にこんな記事も読まれています'  
</script>
<script src="http://www.linkwithin.com/widget.js"></script>
<a href="http://www.linkwithin.com/"><img src="http://www.linkwithin.com/pixel.png" alt="Related Posts Plugin for WordPress, Blogger..." style="border: 0" /></a>

はい。これで完了！おつかれさまでした。

あとは設定を保存して、自分のサイトを見てみましょう。
他のおすすめ記事が表示されているはずです。

もっとアグレッシブにオススメしたい！という方には

ちなみに、日本語で提供されているzenbackというサービスもあります。
客の懐具合などおかまいなしに、サイドメニューをガンガン推してくる
定食屋のおばちゃんぐらいのアグレッシブさが欲しい方は
zenbackさんのサービスを検討してみてもよいかもしれません。

今後も当サイトでは、デザインを変えながら試行錯誤して
おすすめできそうな内容があれば、ご紹介していきたいと思っています。

ではでは、またー。

こちらの記事もどうぞ：

• 【B】 はてなブログに過去記事を写真で表示する、お手軽カンタンカスタマイズの巻
• 【B】 HTMLやCSSをいじらずに、はてなブログを自分らしく演出するのだ！の巻
• 【B】たった3秒であなたのブログ写真を「それっぽく」する方法、の巻
• 【B】 スパイスのように効いてくる！はてなブログのプロフィール欄カスタマイズ、の巻

腕のいいデザイン事務所で修業しないとふつうは身につかない知識と技と心得 (インプレスムック エムディエヌ・ムック)

デザインの教室 手を動かして学ぶデザイントレーニング(CDROM付)