Google 検索窓を設置する その 2

この記事は Google 検索窓を設置する の続きです。一部内容が重複しています。

今回は前の記事に書いていたソースを元に Google 検索窓のテンプレート を作成します。

Google から持ってきたソースには最後に </center> がありますが、これに相当する <center> がないので、これを削除します。

それではまず最初に、前回作ったソースとそのサンプルを表示します。

<!-- SiteSearch Google -->
<form method="GET" action="http://www.google.co.jp/search">
<table bgcolor="#ffffff"><tr valign="top"><td>
<input type="text" name="q" size="15" maxlength="255" value="">
<input type="hidden" name="hl" value="ja">
<input type="submit" name="btnG" value="検索"><br>
<font size="-1">
<input type="hidden" name="domains" value="YOURSITE.CO.JP">
<input type="radio" name="sitesearch" value="">ウェブ全体から検索<br>
<input type="radio" name="sitesearch" value="YOURSITE.CO.JP" checked>サイト内検索<br>
</font></td></tr></table></form>
<!-- SiteSearch Google -->

ウェブ全体から検索
サイト内検索

さて、ここからさらにカスタマイズしていきます。

3行目の <table bgcolor="#ffffff"> の bgcolor="#ffffff" は検索機能の下地の色です。この場合は #ffffff なので白ですね。この数値を変えて好きな色にしたり、<table> とすることによって検索窓を設置する場所の下地の色にすることもできます。
参考リンク ＞＞＞ ■ Web Safe Color/カラーチャート

次は 4行目の size="15" ですが、これは検索窓の横幅を指定する数値です。マイリストの一部としてサイドバーに入れる場合は長すぎるとアレなのでこのサイトでは横幅の数値は 15 に設定してあります。

一番大事なのが value="YOURSITE.CO.JP" です。ここを間違えるとサイト内検索ができません。といっても、やることは簡単。YOURSITE.CO.JP を自分のアドレスに変えるだけ です。URL が http://music.cocolog-nifty.com/ の場合は music.cocolog-nifty.com とだけ記入 します。http:// は要りません。

ソースで青色と緑色に色分けされているところはどっちが先でもかまいません。並べ方を変えると 「ウェブ全体から検索」 と 「サイト内検索」 どっちを上に持ってくるかを決めることができます。

太字になっている checked についてですが、これがついている方がデフォルトになります。つまり、上の場合だと、サイト内検索 のラジオボタンにチェックが入った状態になります。これを ウェブ全体から検索 をデフォルトにしたい場合は下記のように checked を移す必要があります。checked はどちらか片方のみで、両方に checked を記述してはいけません。

<input type="radio" name="sitesearch" value="" checked>ウェブ全体から検索<br>
<input type="radio" name="sitesearch" value="YOURSITE.CO.JP">サイト内検索<br>

ウェブ全体から検索
サイト内検索

あなたのサイトが Google に拾われるまではサイト内検索は使えないので ウェブ全体から検索 をデフォルトにしたほうがいいかもしれません。

以上をふまえると、Google 検索窓のテンプレートはこのようになります。

<!-- SiteSearch Google -->
<form method="GET" action="http://www.google.co.jp/search" target="_blank">
<table bgcolor="#ffffff"><tr valign="top"><td>
<input type="text" name="q" size="15" maxlength="255" value="" />
<input type="hidden" name="hl" value="ja" />
<input type="submit" name="btnG" value="検索" /><br />
<font size="-1">
<input type="hidden" name="domains" value="YOURSITE.CO.JP" />
<input type="radio" name="sitesearch" value="" checked />ウェブ全体から検索<br />
<input type="radio" name="sitesearch" value="YOURSITE.CO.JP" />サイト内検索<br />
</font></td></tr></table></form>
<!-- SiteSearch Google -->

あとは必要に応じて 赤い字のところを変更してください。

// 追記 //
検索結果を新しいウィンドウで開くように上のソースに target="_blank" を追加しました。要らない人はサクッと削除してください。

- Google 検索窓を設置する
- Google 検索窓を設置する その 3　マイリストへの追加
- Google 検索窓を設置する その 4　ココログ内検索 [ 改訂版 ]

// お知らせ //
Google 検索窓 関連記事へのトラックバックについてのお知らせ をお読みください。