カスタマイズしたGoogle検索窓が欲しいなら、やり方はこれ。
ブログをやっていると、アクセスカウンターと同様、Google検索窓なんて欲しくなりますね。そんな時のやり方、
1、Google AdSenseにログインしたら、サーチ設定タブをクリック。
2、サイトの言語「日本語」、国「日本」。
3、サンプルの所で「Google SiteSearch」のラジオボタンを選択。
4、「 サイト検索のドメインを3つまで入力ください 複数のドメインは セミコロン " ; " で区切ってください。 」の所で、指示通り入力。
例、僕の場合、「cocolog-nifty.com;soba.txt-nifty.com」を入力。
前半がココログ用、後ろがひなたぼっこ用
5、「テキストボックスの長さ」で「15」文字列と入力。(サイドエリア設置ではこのくらいが適当。あくまでもボックスの長さ、デザイン上の設定です。入力時にはもっと多数の文字を入力できるので問題はない。
6、レイアウト オプションでは「テキストボックスの上の Google ロゴ」にチェック。(サイドエリアは狭いので)
7、「お客様のサイトのエンコード」で「Unicode(UTF-8)」を選択。
※そうしないと、検索結果が文字化けする。ここでやり忘れたら、あとで、タグ中「Shift_Jis」とあるところを「UTF-8」にしても良い。
参考、「Google検索と文字化けや検索不具合。」
8、「コードを更新」ボタンをクリックし、Google 検索ボックスコードの所で、ボックスの所をクリックするとタグが選択状態になるので「Ctrl+C」でコピーする。
9、HTMLエディタのNvu(エヌビュー)を立ち上げ、下の「source」タブをクリック、上記8のタグを貼り付ける。「preview」タブで見て、(画像参照)
※なお、Nvu(エヌビュー)は、Mozillaから派生したオープンソース高機能HTMLエディタです。もちろん無料です。
(画像をクリックすると拡大します。)
と出ているのを確認。
10、再度「source」タブをクリックして、inputタグ中の二番目の「cocolog-nifty.com」を「ココログ」、また二番目の「soba.txt-nifty.com」を「ひなたぼっこ」あるいは「当サイト」などと修正する。
11、下の「Normal」をクリックして切り替えると、その通り表示されている。(画像参照)
(下記以下の部分は、追記を参考にしていただく方法もあります。エディタを使いなれている人はその方が簡単です。)
12、枠を右クリックして、Table Insert→Row Belowとして、枠列を下に追加する。
13、ラジオボタンを含めて「ひなたぼっこ」「ココログ」を「Web」の下の枠にコピペしなおす。
14、開いた枠列はそのままにしておいても良いが、練習を兼ねて「赤丸」の所をクリックしてみる。そうすれば余分な枠は消える。(画像参照)
15、「preview」タブに切り替えると綺麗に仕上がっているのが分かる。「source」タブに切替えて出来上がったタグをサイドエリアなどにコピペすればよい。
追記、11以下の作業箇所ですが、「Nvu(エヌビュー)」ではレイアウトだけ確認し、「へてむるクリエイタ~」で表(テーブル)を書き直し、サイト検索のデータ部分(サイトデータの直前・直後の<td></td>で囲まれた部分)をコピペし直して並べ替えてしまうという手もあります。僕はどちらかと言うとこちらの方が好み。「Nvu(エヌビュー)」はそこそこに高機能なのでタグ的に余計な記述が増えるからです。Googleの検索窓向けAdSenseでチャネル管理を利用している場合、生成されたタグのうち、並べ替えた<table></table>で囲まれた部分を差し替えればよい。「へてむるクリエイタ~」で表を書くやり方は関連投稿を参考にしてください。
なお、デフォルトではラジオボタンの選択がWebになっています。
<input type="radio" name="sitesearch" value="" checked="checked"></input>
<font size="-1" color="#000000">Web</font>
このタグの内の「checked="checked」がそれです。この部分を最初から選択状態にしたいタグの方にコピペしなおします。僕のココログでは「当サイト」のところに設定しなおしてます。
関連投稿
「ひどい誤解だ。ココログはベーシックの無料コースだってカウンタ設置も検索窓設置もできるよ。」
「「Nvu 1.0」正式公開。アフィリエイトやココログやるならHTMLエディタくらい使わなきゃね。」
「ブログやココログやるなら、エディタくらい使わなきゃね。」
「ブログで表を表示させたい時のタグ表記はこれ。」
「ココログのスタート時最低限ツール&カスタマイズは多分これ。そしてブログで挫折しない為のやり方とは。」
「エディタ解説本、昔は少なかったが、今は結構ありますネ。」
「こんな感じで英辞郎を使ってます。」
「QXエディタと辞書引きと英辞郎設定のやり方。」
「DokoPopで更に便利に英辞郎。便利だぁ~ぁぁ!」
「QTClipは必需品、ココログ・アフィリエイトをやるからには。」(QTClipはQXエディタ、QGrep
の姉妹ソフトです。但し、単体で使えるフリーソフトです。)
| 固定リンク
この記事へのコメントは終了しました。
コメント
トラックバックとダブルで失礼します。折角コメントいただいたGoogleの検索窓ですが、同日中に修正できておりまして(よろしければトラックバックさせていただいた記事をご参照ください)、ロゴがちょっと大きいかな~と思いつつも快適に利用中です。HTMLはほんのちょっとかじっただけなんで、手こずりながらやってます。ちょくちょく遊びに来てますんで、また新しい情報あったらお願いします。ではでは。
投稿: いいぶう | 2005年7月 3日 (日) 13時42分
はじめまして。
先日、コメントを頂いたharukaです。
かなりの初心者なので、これからコツコツいろんな事に挑戦していきたいと思っていますので、とても参考になりそうです。
困った時にはまた覗きに来たいと思います。
ありがとうございました。
投稿: haruka | 2005年7月 4日 (月) 22時07分
コメント有難うございました。今から、アクセスカウンターと代格闘させて頂きます。これからも宜しくお願いします。
投稿: ハーブ | 2005年7月 7日 (木) 21時45分
カウンター設置と写真完了しました!!!!!!!バンザイ!!!!!!!!
もしよければ、ここのプログをリンクに貼りたいと考えているのですが宜しいでしょうか?プログのほうにメール送信できるようにしたので、ご回答お待ちしてます。これからも宜しくお願いします。
投稿: ハーブ | 2005年7月 9日 (土) 19時15分
はじめまして、さゆみです。
先月からブログを書き始めたばかりで、やっと今日私も検索窓を設置しました!!!今度は、アクセスカウンターを設置したいと思います。
楽しみながら、少しずつ見てくださる方に楽しんでもらえるようなブログを書き続けていきたいな~~と思います♪
これからも、お手本にさせて頂きたいと思いますので、宜しくお願いします。
投稿: さ | 2005年7月14日 (木) 10時50分
この記事、とても参考になりました。
SOBAさんのおかげで
検索窓を設置することが出来ました。
ありがとうございました。
投稿: hitoto40 | 2005年8月22日 (月) 18時15分