Google検索を設置する

　ブログ内の検索を強力にしたいと思って、Googleのサイト検索をナビゲーション及び右サイドバーに設置しました。トップページの内容だけでなく、ブログの全記事、及びコメントの内容まで検索できます。FC2ブログの検索よりも強力な検索が可能となりました。

ウェブ全体から検索http://yozoblog2.blog63.fc2.com/を検索

　設置したGoogleのサイト検索のコードは、リンク、検索機能を追加のGoogle フリー検索 (ベーシック版) : ウェブ検索 + サイト検索で公開されています。yozoはそのコードを、許可されている範囲内で、自分なりにカスタマイズしてXHTMLに準拠させています。このコードをコピペしたい方は、３箇所(右サイドバー用では２箇所)のhttp://yozoblog2.blog63.fc2.com/をご自分URLに変更してから貼り付けてくださいね。またここのブログはFC2ブログですから文字コード(２箇所)はeuc-jpとなっていますが、ブログサービスによってはshift_jisやutf-8にする必要がありますのでご注意ください。

貼り付けコード

この記事のコード

<div class="searchstyle"><form method="get" action="http://www.google.co.jp/search"><a href="http://www.google.co.jp/"><img src="http://www.google.com/logos/Logo_40wht.gif" width="128" height="53" alt="Google" title="Google" /></a><br /><input type="text" name="q" size="31" maxlength="255" value="" accesskey="a" tabindex="1" /><input type="hidden" name="ie" value="euc-jp" /><input type="hidden" name="oe" value="euc-jp" /><input type="hidden" name="hl" value="ja" /><input type="submit" name="btnG" value="Google 検索" accesskey="b" tabindex="2" /><br /><input type="hidden" name="domains" value="http://yozoblog2.blog63.fc2.com/" /><span style="font-size:10px;"><input type="radio" name="sitesearch" value="" accesskey="c" tabindex="3" /> ウェブ全体から検索<input type="radio" name="sitesearch" value="http://yozoblog2.blog63.fc2.com/" accesskey="d" tabindex="4" checked="checked" />http://yozoblog2.blog63.fc2.com/を検索</span></form></div>

右サイドバーのコード

<div class="searchstyle"><form method="get" action="http://www.google.co.jp/search"><a href="http://www.google.co.jp/"><img src="http://www.google.com/logos/Logo_40wht.gif" width="128" height="53" alt="Google" title="Google" /></a><br /><input type="text" name="q" size="18" maxlength="255" value="" accesskey="a" tabindex="1" /><br /><input type="hidden" name="ie" value="euc-jp" /><input type="hidden" name="oe" value="euc-jp" /><input type="hidden" name="hl" value="ja" /><input type="submit" name="btnG" value="Google 検索" accesskey="b" tabindex="2" /><br /><input type="hidden" name="domains" value="http://yozoblog2.blog63.fc2.com/" /><span style="font-size:10px;"><input type="radio" name="sitesearch" value="" accesskey="c" tabindex="3" />ウェブ全体から検索<br /><input type="radio" name="sitesearch" value="http://yozoblog2.blog63.fc2.com/" accesskey="d" tabindex="4" checked="checked" />このブログ内を検索</span></form></div>

検索フォームを囲んでいる枠線はCSSで設定しています。（class="searchstyle"となっている分です。）

CSS編集で追加するコード

.searchstyle
{
background-color: #FFFFFF;
padding: 5px;
margin : 15px 20px 15px;
border-style: solid;
border-width: 2px;
border-color: #DCE3E3 #C1C1C1 #C1C1C1 #DCE3E3;
}

• yozoからのお願い

　この記事の内容は、yozoが実際にやってみたことを書いているだけです。この記事の方法しかないというものではありませんし、もっと簡単で、すばらしい方法もあると思います。この点をあらかじめご了承ください。
　また、言うまでもないことですが、この記事を参考にされるのでしたら、「フォーム改造」は自己責任で行ってください。
　この記事を参考にされた場合は、結果や感想を、CommentやTrackbackしていただけたら、うれしいです。もちろん、「これではおかしいのでは？」とか「こうしたほうが良い。」というご指摘やご指導もありがたく頂戴したいと思っています。よろしくご協力ください。　m(_ _)m

↓　ぽちっと応援お願いします♪ m(_ _)m