はてブやTwitterへのコメントを
ブログに表示させてみるとこうなる

日々生み出されるネットサービスやテクノロジーに詳しい著者による、こんなふうにサービスに取り込んだら面白いのではないか、という提案。技術的な応用面にフォーカスしていく（編集部）

はてブやTwitterを活用して自分のサイトをアピールする

今年の春に行った、Lostのあの海岸(撮影:著者)

　気が付けば、9月。あっという間に今年も終盤に突入かと思うとぼう然としてしまいますが、9月9日（日本時間では9月10日の2:00時）には、毎年恒例Appleの新製品発表が予定されていたり、TVドラマ「Lost」のシーズン4がケーブルテレビで放送開始されたりと、個人的には待ち遠しさも最高潮の複雑な気持ちだったりします。

　さて、そんな前フリとはまったく関係がありませんが、今回のテーマは「ソーシャルツールでブログをパワーアップしよう！」です。

　せっかくブログを書いても、思うように反応が集まらなかったり、直接のコメントではなくソーシャルブックマークなどにコメントが付いて、肝心のサイトが閑散としていたりすると、記事を書くモチベーションも上がりません。

　そこで今回は、さまざまなソーシャルツールと連携して、皆さんのブログをパワーアップする方法をいくつか探してみました。

ソーシャルブックマーク連携

　最近では、ブログ記事へのトラフィックを得るための手段として、各種ソーシャルブックマークの「人気ランキング」に入ることが重要になっています。内容にもよりますが、例えば「はてなブックマーク」のホットエントリに掲載されると、数千のアクセスが発生するようです。

　また、ブックマークとともに公開される「コメント」は、単なるメモを超えて、その記事への意見を公開する最もポピュラーな手段の一つになってきています。

　ソーシャルブックマークは、集客しつつそのお客さんからの反応を得ることができる、非常に便利なツールになっているといえるでしょう。

□ 主要なブックマークサービス

• はてなブックマーク（http://b.hatena.ne.jp/）
• livedoor クリップ（http://clip.livedoor.com/）
• Choix（http://www.choix.jp/）
• POOKMARK Airlines（http://pookmark.jp/）
• newsing（http://newsing.jp/）

ブックマークコメントを自分のサイトに表示する

　ぼくのかかわっている音楽ニュースサイト「ナタリー」は、記事へのコメントが多いのが特徴の一つですが、経験上「すでにコメントが付いている記事は、コメントが付きやすい」ということが分かっています。

　自分の記事をブックマークしてもらうために、各種サービスのブックマークボタンを設置している人は多いと思いますが、コメントはそれぞれのサービスのサイトに読みにいく必要があったり、コメント一覧を表示する機能が提供されていても、わざわざクリックしないといけなかったりで、いまいち面倒です。

　そこでここでは、特に人気のあるブックマークサービスである「はてなブックマーク（以下はてブ）」と「livedoorクリップ」で付けられたコメントをブログの記事の中に一緒に一覧表示するスクリプトをご紹介します。

□ masuidriveさんの、はてブコメント表示JavaScript

　はてなブックマークは、記事に付いたコメントの数を表示する機能を外部のブログサービスの利用者に向けて提供していますが、その場でコメントを読むことができず、一度はてなのサイトにジャンプする必要があります。

　しかし、masuidriveさんが、コメント一覧を展開してダイレクトに記事中に埋め込むスクリプトを公開されています。

• ブログにはてブのコメントを表示するhatana_bookmark_anywhere.js （Hatana bookmark anywhere Archive）

　ブログ記事にJavaScriptを埋め込むだけで、自動的にその記事に付けられたはてブコメントを取得してきて、まるではてブのように一覧表示してくれます。パラメータを設定することで、表示件数や表示スタイルの変更、コメントのないブックマークの非表示などのカスタマイズを行うことができます。

この記事に関するコメント一覧

　各種ブログサービスごとの詳細な設置方法やカスタマイズの方法が、こちらのエントリで紹介されています。

• hatana_bookmark_anywhere.jsの設置方法とカスタマイズ

□ livedoorクリップのJavaScript

　livedoorクリップの場合、公式ツールとしてブログにコメント一覧を取り込むスクリプトを配布しています。

Livedoorブログユーザーにはおなじみ

　コメントまわりの機能強化（ブログへの「クリップコメント」貼り付け機能も！）

http://blog.livedoor.jp/staff_clip/archives/51243068.html

コメント一覧。livedoor クリップを利用してコメントできます

□ はてなブックマークで付けられたコメントをblosxomにインクルード＠hail2u.netさん

　masuidriveさんのエントリに付いたはてブコメントで知ったのですが、ブログツールblosxom用に開発された同様のスクリプトが以前から存在したそうです。記事中に「blosxomに限らずさまざまなページに応用できるはず」と書かれているのでこちらもチェックしてみてください。

• はてなブックマークでつけられたコメントをblosxomにインクルード
  

1-2

INDEX
これ、俺ならこう使う（3） ソーシャルブックマークやTwitterと連携して、ブログをパワーアップ
	Page1 はてブやTwitterを活用して自分のサイトをアピールする ソーシャルブックマーク連携 ブックマークコメントを自分のサイトに表示する ・ masuidriveさんの、はてブコメント表示JavaScript│ ・ livedoorクリップのJavaScript│ ・ はてなブックマークで付けられたコメントをblosxomにインクルード＠hail2u.netさん
	Page2 Twitterと連携 ・ twitterfeedでブログの更新情報をTwitterに投稿 ・ Tweet Me! どうしてブクマやTwitter経由でコメントしてもらうの？ ・ 慣れたツールでならコメントしやすくなる ・ ソーシャルツールに同時ポストすることで広がりが生まれる ・ ユーザーの向こうにあるネットワークを活用する

■ ＠IT関連記事

Twitterやクラウドへも分岐するAjax／Web APIの道 Ajax うきうき Watch（29）　芸能人も参加中のGoogleマイマップEXPO、日本語化するTwitter、クラウドコンピューティング、もうすぐ始まるIE 7への自動更新など全8トピック 「リッチクライアント ＆ 帳票」フ ォーラム 2008/1/23

jQueryを使ってTwitterをおいしくマッシュアップ パターンとライブラリで作るAjaxおいしいレシピ（1）　jQueryを使ってTwitterのコメントをかんたんに表示するサンプルを見ながら、AjaxデザインパターンやMVCについて解説 「リッチクライアント ＆ 帳票」フ ォーラム 2007/8/29

過熱するTwitterブームとMicrosoftのマッシュアップ Ajax うきうき Watch（21）　すさまじい勢いで増え続けるTwitterを使ったツールやマッシュアップを使ったまったく新しいサイト。さらに、無料Webオフィスほか5トピックを紹介！ 「リッチクライアント ＆ 帳票」フ ォーラム 2007/5/25

過熱するTwitterブームとMicrosoftのマッシュアップ Ajax うきうき Watch（21）　すさまじい勢いで増え続けるTwitterを使ったツールやマッシュアップを使ったまったく新しいサイト。さらに、無料Webオフィスほか5トピックを紹介！ 「リッチクライアント ＆ 帳票」フ ォーラム 2007/5/25

Google App Engineは20％プロジェクトから生まれた Google Developer Day 2008特集（2）　プロダクトマネージャーに聞く、App Engineの成り立ちと現状、ビジネス、Amazon EC2との違い、そして日本人への期待 「リッチクライアント ＆ 帳票」フ ォーラム 2008/6/24

ご意見、ご感想は Smart＆Social 会議室へどうぞ

Smart＆Social フォーラム トップページへ