<img alt="ECサイトやビジネスサイト、ブログなどに適したチャットパーツ" src="http://web-marketing.zako.org/images/hab-la-top.jpg" width="250" height="250" />
<p>以前に<a href="http://web-marketing.zako.org/web-tools/10-chat-blogparts.html" onclick="javascript:urchinTracker('/go/text_link');" onkeypress="return hs.expand(this)">チャットでリアルタイムに問合せ対応できるブログパーツ10選を検証</a>というエントリを書きましたが、今回は4行のスクリプトを追加するだけでブラウザのアドオンのようにリアルタイムチャットを表示できるサービス、そして複数アカウントまとめサービスとの合わせ技と共にご紹介。</p>

<!--more-->
<h3 class="header-label">ブラウザのアドオンのようなチャット機能「hab.la」</h3>
<p class="picture"><img alt="hab-la.gif" src="http://web-marketing.zako.org/images/hab-la.gif" width="400" height="200" />
このようにサイトの右下部分にチャットのボタンが表示されます。あからさまな部分に表示されない分、本当に問い合わせたい人に絞込みができて良いかも！？</p>
<p>サイト運営者がチャットをするときに使うアカウントは「Jabber」。サービスに登録すると専用のアカウントを同時に発行してくれます。</p>
<p>待ちきれない方は<a class="web-site-link" href="http://hab.la/" onclick="window.open('http://hab.la/'); return false;">Hab.la</a>へどうぞ。</p>
<h4 class="header-label">チャットプレビュー</h4>
<ol>
<li>チャットを展開して訪問者がコメント<br />
<img alt="hab-la2.gif" src="http://web-marketing.zako.org/images/hab-la2.gif" width="400" height="294" /></li>
<li>サイト運営者が回答<br />
<img alt="hab-la3.gif" src="http://web-marketing.zako.org/images/hab-la3.gif" width="400" height="276" /></li>
</ol>
<p>と、このようなイメージで会話を進めることができるようです。</p>
<p>ちなみに今回私は「Jabber」のアカウントもまとめられる<a href="http://web-marketing.zako.org/web-tools/multiple-gmail-accounts-at-once-digsby.html" onclick="javascript:urchinTracker('/go/text_link');" onkeypress="return hs.expand(this)">複数のGmailアカウントも同時管理できるデスクトップガジェット「digsby」</a>を使って「Hab.la」で生成される「Jabber」のアカウントを追加してみました。</p>
<h4 class="header-label">「digsby」を使ったときのメッセージ受信時のアクション</h4>
<p class="picture"><img alt="hab-la-digsby.gif" src="http://web-marketing.zako.org/images/hab-la-digsby.gif" width="400" height="118" />
↑デスクトップ左下にメッセージ通知。
<img alt="hab-la-digsby-2.gif" src="http://web-marketing.zako.org/images/hab-la-digsby-2.gif" width="432" height="322" />
↑メッセージ送信画面も開く。</p>

<h4 class="header-label">「digsby」と合わせて使う際のチャットスタートアップガイド</h4>
<ol>
<li><a class="web-site-link" href="http://hab.la/" onclick="window.open('http://hab.la/'); return false;">Hab.la</a>のページを開き、「Signup for hab.la」のリンクをクリック</li>
<li>↓の画像の注釈に沿って登録<br />
<img alt="hab-la-digsby-3.gif" src="http://web-marketing.zako.org/images/hab-la-digsby-3.gif" width="400" height="230" /></li>
<li>スクリプトと「Jabber」のアカウントが発行される<br />
<img alt="hab-la-digsby-4.gif" src="http://web-marketing.zako.org/images/hab-la-digsby-4.gif" width="400" height="258" /></li>
<li>↑のスクリプトをサイトの&lt;/body&gt;タグの前、または&lt;/head&gt;の前に追加</li>
<li>「digsby」を開き、↓のようにアカウント設定の画面を開く<a href="http://web-marketing.zako.org/web-tools/multiple-gmail-accounts-at-once-digsby.html" onclick="window.open('http://web-marketing.zako.org/web-tools/multiple-gmail-accounts-at-once-digsby.html'); return false;">「digsby」のセットアップはこちら</a><br />
<img alt="hab-la-digsby-5.gif" src="http://web-marketing.zako.org/images/hab-la-digsby-5.gif" width="400" height="234" /></li>
<li>↓のように「Add IM Account」をクリックし、「Jabber」をクリック<br /><img alt="hab-la-digsby-6.gif" src="http://web-marketing.zako.org/images/hab-la-digsby-6.gif" width="400" height="222" /></li>
<li>先ほど発行された「Jabber」のアカウントと最初に「hab.la」へ登録した際のパスワードを設定すれば完了↓<br />
<img alt="hab-la-digsby-7.gif" src="http://web-marketing.zako.org/images/hab-la-digsby-7.gif" width="400" height="221" /></li>
</ol>
<h4 class="header-label">ボタンでも可能</h4>
<p>ボタンを使う方法もあるようです。</p>
<div>
<a href = "http://static.hab.la/js/html/url_handler.html?siteid=8189-5522344-10-2116">
<img src="http://dyn.hab.la/online/image.cgi/8189-5522344-10-2116/2.gif" border=0></a><br/>
<small>Powered By <a href="http://hab.la" target="_blank">Hab.la</a><small>
</div>

<p>興味のある方は<a class="web-site-link" href="http://hab.la/" onclick="window.open('http://hab.la/'); return false;">Hab.la</a>へどうぞ。</p>
<p>サイトの運営を煩雑にしないで訪問者の満足度を上げるには作業の効率化も重要。そしてレスポンスの速さがなによりも購買の機会損失を防ぐ手段。そう考えるとこの「hab.la」と「digsby」の組み合わせはなかなか使えそうです。</p>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab" id="Player_c283b5ed-65d2-4571-b38e-da302c79a275"  width="400px" height="150px"> <param name="movie" value="http://ws.amazon.co.jp/widgets/q?ServiceVersion=20070822&MarketPlace=JP&ID=V20070822%2FJP%2Fsnowboadteamz-22%2F8010%2Fc283b5ed-65d2-4571-b38e-da302c79a275&Operation=GetDisplayTemplate"><param name="quality" value="high"><param name="bgcolor" value="#FFFFFF"><param name="allowscriptaccess" value="always"><embed src="http://ws.amazon.co.jp/widgets/q?ServiceVersion=20070822&MarketPlace=JP&ID=V20070822%2FJP%2Fsnowboadteamz-22%2F8010%2Fc283b5ed-65d2-4571-b38e-da302c79a275&Operation=GetDisplayTemplate" id="Player_c283b5ed-65d2-4571-b38e-da302c79a275" quality="high" bgcolor="#ffffff" name="Player_c283b5ed-65d2-4571-b38e-da302c79a275" allowscriptaccess="always"  type="application/x-shockwave-flash" align="middle" height="150px" width="400px"/> </object> <noscript><a href="http://ws.amazon.co.jp/widgets/q?ServiceVersion=20070822&MarketPlace=JP&ID=V20070822%2FJP%2Fsnowboadteamz-22%2F8010%2Fc283b5ed-65d2-4571-b38e-da302c79a275&Operation=noscript">Amazon.co.jp ウィジェット</a></noscript>
<script type="text/javascript" src="http://static.hab.la/js/wc.js"></script>
<script type="text/javascript">
wc_init("8189-5522344-10-2116");
</script>