セブンアンドワイの検索フォームをサイドバーに

みんなで解決！広場で、サイドバーに

への検索フォームを設置したい旨の質問があったのですが(1577．設定の仕方。)、どうも公式には検索フォームは提供されていない模様です。

念のため、カスタマーサービスに問い合わせてみたところ、

• 現状、公式の検索フォームは用意していない。
• セブンアンドワイのサイト上部にある検索フォームをカスタマイズして自分のサイトに設置するのは構わない。
• 設置の際、リンク先がセブンアンドワイであることを明記のこと。

という回答が得られました。

そんなわけで、ココログのサイドバー用に検索フォームを作ってみました。
ただ単純に(アフィリエイトプログラムとは関係なく)検索フォームを設置したい、というだけであれば、例えば以下のようなHTMLをメモタイプのマイリスト等に貼り付けてサイドバーに設置すれば可能ではあるようです。

セブンアンドワイのサイト上部にある検索フォームをカスタマイズしたものです。
このサイトのサイドバー(検索きまぐれブックテーマ)内にも設置してみましたので、お試し下さい。

<script type="text/javascript">
<!-- 
function search_action(iSi)
{
    var aShozai = new Array('all', 'books', 'magazine', 'cd', 'dvd');
    if (iSi < 0) { iSi = 0; }
    return 'http://www.7andy.jp/' + aShozai[iSi] + '/search_result';
}
function search_ex(iSi)
{
    var aShozai = new Array('all', 'books', 'magazine', 'cd', 'dvd');
    if (iSi < 0) { iSi = 0; }
    return 'http://www.7andy.jp/' + aShozai[iSi] + '/search';
}
function trap_submit(fObj)
{
    if ( fObj.kword_in.value == '' ) {
        fObj.action=search_ex(form.ctgy.selectedIndex);
    }
    if ( fObj.action == '' ) {
        fObj.action = 'http://www.7andy.jp/all/search_result/' ;
    }
    if ( navigator.userAgent.match(/msie/i) ) {
        document.charset = 'euc-jp' ;
        fObj.submit() ;
        document.charset = 'utf-8' ;
        return false ;
    }
    return true ;
}
// -->
</script>
<table width="100%" cellpadding="0" cellspacing="0" border="0"><tbody>
  <tr>
    <td>
      <form method="get" action="http://www.7andy.jp/all/search_result/" onsubmit="return(trap_submit(this));" target="_blank" accept-charset="euc-jp">
        <table cellpadding="0" border="0" cellspacing="0" style="width:100%;">
          <tr>
            <td>
               <input type="hidden" name="fromKeywordSearch" value="true" />
               <input type="text" maxlength="256" name="kword_in" value="" style="width:90%;" />
            </td>
          </tr>
          <tr>
            <td>
              <select name="ctgy" onChange="this.form.action=search_action(this.selectedIndex);">
                <option value="all" selected>すべての商品</option>
                <option value="books">すべての本</option>
                <option value="magazine">すべての雑誌</option>
                <option value="cd">すべてのCD</option>
                <option value="dvd">すべてのDVD</option>
              </select>
           </td>
         </tr>
         <tr>
           <td>
             <input type="image" name="submit" src="http://www.7andy.jp/esb2004/images/b_search.gif" width="80" height="19" alt="検索" border="0" />
             <input type="hidden" name="oop" value="on" />
           </td>
         </tr>
        </table>
      </form>
    </td>
  </tr>
  <tr><td>
    <!-- Begin 7andy Link -->
      <A HREF="http://www.7andy.jp/">
      <IMG SRC="http://www.7andy.jp/esb/docs/images/7andylg2.gif" ALT="セブンアンドワイ" BORDER=0></a>
    <!-- End 7andy Link -->
  </td></tr>
</tbody></table>

以下、余談ですが。
変なところで苦労したのが、文字コードの問題。
ココログがUTF-8なのに対してセブンアンドワイはEUC-JP……そのままだと日本語で検索すると文字化けしちゃうのですね。
formタグにaccept-charset="euc-jp"を付ければいけるかな？と思えば、Firefox・Operaあたりは大丈夫っぽいけれども、IEはNG……(_ _;)/。
仕方がないので、submit() のときだけ document.charsetを書き替える、という力業を導入してしまいました。

なので、スクリプト(JavaScript)オフの環境では、IEでの日本語検索はNGです。

■修正履歴

• 2006.09.06
  1. 検索ページが2つ開いてしまう(submitが2回実施される)不具合修正
     window.event.cancelBubble=trueは止めて、onsubmitでコールする関数の戻り値で切り分けするよう修正。