Google Blogger の最近にカスタマイズされたテンプレートにはサーチボックス（Search Box：検索窓）が標準で装備されているものが多いです。しかし、Blogger で配布されている純正テンプレートには検索窓がありません。検索はもはやインターネットを使う上での必要不可欠な要素です。知りたいことがあればネットで検索する。検索して見つかったサイトやブログの中で更に検索して、必要な情報を探すというのが一般的なスタイルです。
検索窓がないブログは長く滞在したくない
検索窓が付いていないサイトやブログはユーザビリティーが悪いと思います。ブラウザのページ内検索機能を使って、表示されている限られた範囲から欲しい情報を探し出すことになってしまいます。Google 検索でコマンドを使って「検索ワード site:URL」で検索する訪問者は数える程でしょう。
一般的には、ページ上に見えている範囲で最近の記事一覧を見てみたり、タグクラウド、カテゴリ、アーカイブと探していくうちに、だんだん嫌になってきてサイトやブログから去ってしまうでしょう。
こうならないためにもブログに検索窓は不可欠ですね。
Google Blogger 標準の検索ボックス
Blogger のガジェットにも標準で「検索ボックス」があります。でも、結局この検索ボックスは Google 検索そのものです。Google にインデックスされていない記事は検索に引っかかりません。結果表示もいつも見ている Google 検索そのもので、ザザーっと検索結果の文字が並ぶだけ。
- 投稿したばかりでインデックスされていない記事もヒットさせたい
- ブログの中に検索結果を表示したい
シンプルな検索ボックス
Google Blogger にシンプルなサーチボックスを取り付けるのは比較的に簡単で、下記のコードを貼り付けるだけです。
<form method="get" id="searchform" action="/search">
<input type="text" style="80%; padding:2px;" value="ブログ記事検索..." onfocus="if (this.value == &"ブログ記事検索...&") {this.value = &"&"}" onblur="if (this.value == &"&") {this.value = &"ブログ記事検索...&";}" name="q" id="sbox" class="sbox">
<input type="button" Value="検索" id="sbutton" class="sbutton" alt="">
</form>
２行目の style にある「80%」 は検索文字入力フィールドの幅を相対的に指定しています。
ブログのフォントサイズ設定によって[検索]というボタンの幅が可変なので、80%という値は[検索]ボタンが折り返されないように設置場所の幅に合わせて調整してください。
value の 「ブログ記事検索...」という文字列は、検索窓の中に予め記述されるものです。このブログの最上部にあるサーチボックスは「検索キーワードを入力」としています。
６行目の button にある「value」 は検索ボタンの中に表示される文字列。Submit でも GO でもお好きなものに変更してください。
設置場所
簡単なのはサイドバーの最上段ですかね。
HTML/JavaScript のガジェットを追加して上記のコードを貼り付けます。
ダッシュボート(管理画面)のレイアウトから、設置場所に「HTML/JavaScript」ガジェットを追加します。
ここにお好みに合わせて修正した上記のコードを貼り付けます。
0 comments:
コメントを投稿