サイト内検索をできるようにしてみました

昨日、サイドバーにGoogleの検索フォームを設置しました。他の方のサイトを訪れたとき、意外と便利なのが“サイト内検索”です。ブログの場合、関連記事はカテゴリーで分類されているのでそれほど不自由はありませんが、それでも「このキーワードで！」という時には役に立ちます。うちのブログはシンプルを信条に、ブログペット以外は設置しないようにしてきました。しかし、記事も増えてきたことですし、そろそろ検索機能くらいはあっても良かろうと。

さて、検索ツールですが、Googleをはじめ、YAHOO!やInfoseekなど、様々なモノが提供されています。昨今はYAHOO!と言えばオークション、Infoseekは合併した楽天のロゴも表示されるため“通販”が連想されてしまいます。そのため、純粋な検索のイメージが強いGoogleを選択しました。

設置方法は簡単です。Googleトップ＞Googleについて＞リンク、検索機能を追加とたどると、サイト内検索のhtmlソースが提供されています。それをコピーして指定部分を変更し、ココログならマイリストに追加するだけです。
ただ、このままだと見本どおりの横長表示となり、サイドバーに収まらないため、多少いじってます。大きすぎるロゴを小さいものと交換したり、縦積み表示に変更したり。参考までに、いじったポイントを記載しておきます。

※ソースイメージの画像はクリックすると拡大表示されます。
①検索結果が別ウィンドウで開くようにオプションを追加
②右サイドバーに設置するため、左寄せにする設定を追加
③GoogleロゴをクリックしたときもGoogleサイトが別ウィンドウで開くようにオプションを追加
④GoogleのロゴをGoogleロゴ使用のページから選択して変更
⑤適当な単位で縦に並べるようにテーブルの行区切りを追加
⑥検索ワードを入力するテキストボックスのサイズを調整～表示サイズは小さめですが、検索ワードは枠を越えて入力できます。
⑦文字のエンコードを変更～ココログの場合は"Shift_JIS"を"UTF-8"にします。
⑧検索ボタンも小さくするため、"Google検索"を"検索"に変更
⑨サイト内検索の対象にしたい自分のサイトのURLに変更～サイト内検索のタイトルも変更
⑩テーブル指定で行区切りを行っているため、元のhtmlに唯一ある改行指定の<br>タグを削除

転載禁止のため自分のサイトに張り付けることはできませんが、今まで記念日などにだけ使われた“特別ロゴ”も閲覧可能です。面白いデザインのロゴがたくさんありますので、見るだけでもお薦めです。

(byぶらっと)