ブログにGoogleの検索窓を設置する方法 - ゆる～り、ゆるゆると～

私は、FC2ブログ、ライブドアブログ、ココログのブログを
持っているので設定手順も載せておきます。
この３つのブログで細かい説明はどうでもいい。
とにかく設置したいという方は、手順だけに進んでもＯＫです。

gooブログ無料版は2005年10月現在の情報でHTML自由記述欄がない
ようなので、できないかもしれません。

では、解説に入ります。
初心者向けに書いています。
参考になればと書いていますが、私がサポートするわけでは
ありませんので、ご了承ください。

Googleの検索窓の設置方法はGoogle のこのページの
Google フリー検索 (ベーシック版) : ウェブ検索 + サイト検索
に出ています。

これをそのままブログのサイドバーに使うには、
幅が広いですから、サイドバーに置きやすいように
デザインを調整します。

このような表示になります。

WWW を検索
YOURSITE.CO.JP を検索

このデザインのコード

<!-- SiteSearch Google -->
<form method=get action="http://www.google.co.jp/search" target="_blank">
<a href="http://www.google.co.jp/">
<img src="http://www.google.com/logos/Logo_25wht.gif"
border="0" alt="Google" align="absmiddle"></a><br>
<input type=text name=q size=16 maxlength=255 value=""><br>
<input type=hidden name=ie value=Shift_JIS>
<input type=hidden name=oe value=Shift_JIS>
<input type=hidden name=hl value="ja">
<input type=submit name=btnG value="Google検索"><br>
<font size=-1>
<input type=hidden name=domains value="YOURSITE.CO.JP">
<input type=radio name=sitesearch value=""> WWW を検索<br>
<input type=radio name=sitesearch value="YOURSITE.CO.JP" checked>
YOURSITE.CO.JP を検索
</font>
</form>
<!-- SiteSearch Google -->

<!-- SiteSearch Google -->
<form method=get action="http://www.google.co.jp/search">　--- (1)
<a href="http://www.google.co.jp/">                        ----(2)
<img src="http://www.google.com/logos/Logo_25wht.gif"     
border="0" alt="Google" align="absmiddle"></a><br>        
<input type=text name=q size=16 maxlength=255 value=""><br>  --(3)
<input type=hidden name=ie value=Shift_JIS>                 ---(4)
<input type=hidden name=oe value=Shift_JIS>
<input type=hidden name=hl value="ja">
<input type=submit name=btnG value="Google検索"><br>        --(5)
<font size=-1>
<input type=hidden name=domains value="YOURSITE.CO.JP">     --(6)
<input type=radio name=sitesearch value=""> WWW を検索<br>
<input type=radio name=sitesearch value="YOURSITE.CO.JP" checked>
YOURSITE.CO.JP を検索
</font>
</form>
<!-- SiteSearch Google -->


(1)検索フォーム
<form method=get action="http://www.google.co.jp/search">
検索結果を別ウィンドウで表示させたい場合、後ろに target="_blank"
をつけます。私は、別ウィンドウで表示させる方が好きなのでこちらを
使ってます。

<form method=get action="http://www.google.co.jp/search" target="_blank">

(2)Google のロゴ画像
<a href="http://www.google.co.jp/">
<img src="http://www.google.com/logos/Logo_25wht.gif"
border="0" alt="Google" align="absmiddle"></a><br>
画像を表示の部分です。
表示させたくなければこの部分をカットすればいいです。
ロゴ画像を差し替えることもできます。
公式ページのロゴのページを参照ください。

Google の公式ロゴのページはこちら

(3)検索入力欄
<input type=text name=q size=16 maxlength=255 value=""><br>
入力欄の幅の調整は、size=16 の部分を変更します。
<br>は改行です。ボタンをすぐ右横につけたい場合はカット

(4)文字コード設定部分
<input type=hidden name=ie value=Shift_JIS>
<input type=hidden name=oe value=Shift_JIS>

文字化けするという人は、ここが自分のブログの文字コードとあっているか
確認してみてください。

私が調べた主要ブログのコードです。

Shift_JIS	SeesaaBlog、ヤブログ、ドリコムブログ、ウェブリブログ
EUC-JP	FC2,ライブドアブログ、gooブログ、JUGEM、はてなダイアリー、楽天ブログ、Yahooブログ
UTF-8	ココログ、アメーバブログ、エキサイトブログ、Movable Type

文字コードが Shift_JIS でないブログはここを修正します。

文字コードが EUC-JP のブログ
<input type=hidden name=ie value=euc-jp>
<input type=hidden name=oe value=euc-jp>

文字コードが UTF-8 のブログ
<input type=hidden name=ie value=utf-8>
<input type=hidden name=oe value=utf-8>

(5)検索実行ボタン
<input type=submit name=btnG value="Google検索"><br>
ボタンの文言を変更する場合は、ここの文字列を修正してください。

(6)ブログ内検索設定
<input type=hidden name=domains value="YOURSITE.CO.JP">
<input type=radio name=sitesearch value=""> WWW を検索<br>
<input type=radio name=sitesearch value="YOURSITE.CO.JP" checked>
YOURSITE.CO.JP を検索

ここの３箇所を自分のブログのドメインに変更します。３つめは文言なので
適当に設定すればいいです。

<input type=hidden name=domains value="kisako3.blog33.fc2.com">
<input type=radio name=sitesearch value=""> WWW を検索<br>
<input type=radio name=sitesearch value="kisako3.blog33.fc2.com" checked>
このブログを検索

ただし、URL表示形式がFC2のようなサブドメイン形式
http://kisako3.blog33.fc2.com/
http://の次に、ユーザーIDがつくブログの場合に有効です。

ライブドアブログ無料版のようにURL の最後にユーザーIDがつく
場合は、ドメイン指定ができません。
http://blog.livedoor.jp/kisako3/

その場合は、inurl を使います。上記3行を下記の2行に書き換えます。

<input type=radio name=hq value=""> WWW を検索<br>
<input type=radio name=hq value="inurl:blog.livedoor.jp/kisako3" checked>
このブログを検索

ただ、ドメイン指定ができない場合、
Googleで検索すると、同じサイト（同一ドメイン）と判断されれば最大で2ページしか検索結果に
表示されないという仕様が適用されるように思います。
それでも、全くヒットしないよりはいいと思います。

以上、(1)～(6)の手順に従って、自分のブログに合わせて、
必要箇所を変更して、ブログでHTML自由記述欄にコードを
貼り付ければＯＫです。

---

●FC2ブログ の設定方法

共有プラグインに入ってます。
作者：pyridoxinさん
(1)ブラグインの設定→プラグインの追加（共有）→プラグインサーチで『google』
(2)Google フリー検索を追加

(3)ロゴの画像が大きいと思います。
変更したい場合は、デザインは、プラグインの設定のHTML編集で修正できます。
私の修正例はこちら。ロゴ画像を下に、検索結果を別ウィンドウにしました。

<form method="get" action="http://www.google.co.jp/search" target="_blank">
<input type="text" name="q" size="18" maxlength="255" value="" accesskey="q" tabindex="1" /><br>
<input type="hidden" name="ie" value="EUC-JP" accesskey="i" tabindex="2" />
<input type="hidden" name="oe" value="EUC-JP" accesskey="o" tabindex="3" />
<input type="hidden" name="hl" value="ja" accesskey="j" tabindex="4" />
<input type="submit" name="btnG" value="Google検索" accesskey="g" tabindex="5" /><br>
<input type="hidden" name="domains" value="<%url>" accesskey="d" tabindex="6" />
<input type="radio" name="sitesearch" value="" accesskey="w" tabindex="7" /> WWW検索<br>
<input type="radio" name="sitesearch" value="<%url>" checked="checked" accesskey="b"  tabindex="8" /> ブログ内検索<br>
<a href="http://www.google.co.jp/">
<img src="http://www.google.co.jp/logos/Logo_25wht.gif"
 alt="Google"  border = "0" longdesc="http://www.google.co.jp/logos.html" /></a>
</form>

---

●ライブドアブログの設定方法

ライブドア無料版の場合、Googleで検索すると、同じサイトは
最大で2ページしか検索結果に表示されないという仕様が適用
されると思いますので、全てが検索できないと思います。
それでも、全くヒットしないよりはよくて、標準のブログ内検索
よりヒット率はいいと思います。


(1)カスタマイズ/管理→プラグインの新規追加→上級者向けプラグイン→フリーエリアを追加
(2)検索コードをはりつけます。

ライブドアブログ無料版の場合
下記、1箇所、自分のユーザID に変更して貼り付けてください。

<!-- SiteSearch Google -->
<form method=get action="http://www.google.co.jp/search" target="_blank">
<a href="http://www.google.co.jp/">
<img src="http://www.google.com/logos/Logo_25wht.gif"
border="0" alt="Google" align="absmiddle"></a><br>
<input type=text name=q size=16 maxlength=255 value=""><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検索"><br>
<font size=-1>
<input type=radio name=hq value="inurl:blog.livedoor.jp/kisako3" checked>このブログを検索　<br>
<input type=radio name=hq value="">ウェブ全体から検索<br>
</font>
</form>
<!-- SiteSearch Google -->

ライブドアブログ有料版の場合

下記、2箇所、自分のユーザID に変更して貼り付けてください。

<!-- SiteSearch Google -->
<form method=get action="http://www.google.co.jp/search" target="_blank">
<a href="http://www.google.co.jp/">
<img src="http://www.google.com/logos/Logo_25wht.gif"
border="0" alt="Google" align="absmiddle"></a><br>
<input type=text name=q size=16 maxlength=255 value=""><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検索"><br>
<input type=hidden name=domains value="kisako3.livedoor.biz">
<font size=-1>
<input type=radio name=sitesearch value="kisako3.livedoor.biz" checked>このブログを検索<br>
<input type=radio name=sitesearch value="">ウェブ全体から検索<br>
</font>
</form>
<!-- SiteSearch Google -->

(3)改行設定 変換しないをチェックします。
(4)この内容で設定するをクリック
(5)プラグインの設定で、追加したフリーエリアのタイトルに『Google検索』と入れます。
(6)ブログに設定を反映（再構築）→サイドバー（プラグイン）を選択→ブログを再構築するボタンを
クリックします。

---

●ココログの設定方法

私はココログベーシックです。
2004年5月に１件テスト投稿しただけなので放置してたので、
ほとんど使い方は知りません。

(1)マイリスト→マイリストの新規作成で、リストのタイプ『メモ』を選択
　リストの名前を『Google検索』と入れて、リストの新規作成ボタンをクリック
(2)このリストをブログまたはプロフィールページで表示する→ブログをチェックして
　 変更を保存
(3)項目を追加で
　ラベルは空欄でOK、メモに検索コードをはりつけます。
下記、2箇所、自分のユーザID に変更して貼り付けてください。

<!-- SiteSearch Google -->
<form method=get action="http://www.google.co.jp/search" target="_blank">
<a href="http://www.google.co.jp/">
<img src="http://www.google.com/logos/Logo_25wht.gif"
border="0" alt="Google" align="absmiddle"></a><br>
<input type=text name=q size=16 maxlength=255 value=""><br>
<input type=hidden name=ie value=utf-8>
<input type=hidden name=oe value=utf-8>
<input type=hidden name=hl value="ja">
<input type=submit name=btnG value="Google検索"><br>
<input type=hidden name=domains value="kisako3.cocolog-nifty.com">
<font size=-1>
<input type=radio name=sitesearch value="kisako3.cocolog-nifty.com" checked>このブログを検索<br>
<input type=radio name=sitesearch value="">ウェブ全体から検索<br>
</font>
</form>
<!-- SiteSearch Google -->