カスタム検索エンジンの作成
まず「カスタム検索エンジンの作成」をして、カスタム検索を設置するサイト（自分のウェブサイト）の登録をします。
- Google の「カスタム検索エンジン」ページを開く。
ログインしていない場合は、[カスタム検索エンジンにログイン]から、Googleアカウントでログイン。
Googleカスタム検索エンジン - 左メニューの[検索エンジンの編集]をクリック。
[検索エンジンの編集]の下のグレーの枠は「すべて」（もしくは「All」）を選択。
「検索エンジンの編集」ページで[Add]をクリック。 - [検索するサイト]にGoogleカスタム検索を設置するサイトのURLを入力。
URLの入力の仕方は、[URL パターン]を参照のこと。
私は今回「http://www.ultimai.com/」のサイト内の「kenchiku」フォルダ内を検索させたいため、「www.ultimai.com/kenchiku/*」と入力。 - [言語]を[日本語]に設定。
- 名前（検索エンジンの名前）を設定する。 [名前を変更]をクリックして任意の名前を入力。
上記 1. の「検索エンジンの編集」ページでこの名前が表示されます。 - [作成]ボタンクリック。
これでカスタム検索エンジンの作成が完了。
以下、自分のホームページにカスタム検索を設置する方法を説明します。
自分のホームページにカスタム検索を設置する
今回は、検索窓と検索結果ページを分ける方法で設置する仕方をご紹介します。
- まず、検索結果ページのレイアウトを設定する。
左メニューの[検索エンジンの編集]をクリック。
[検索エンジンの編集]の下の、グレーの枠の箇所は、今回設定した検索エンジンの名前を選択
左メニューの[デザイン]をクリック。
開いたページの上の方、[レイアウト]タブをクリック。
レイアウト例がいくつか並んでいる中の、[2ページ]をクリックし、[保存]をクリック。 - 検索結果ページのURLを登録する。
左メニューの[設定]をクリック。
開いたページ中ほど、「詳細」の項目の[コードを取得]をクリック。
ページ読み込み時に実行したい処理がある場合
通常はjavascriptのonloadイベントを使用します。
BODY要素にonload属性を追加したり、
下記のようなjavascriptの指定を追加する方法がよく見られます。
|
1
2
3
|
window.onload = function(){
// ページ読み込み時に実行したい処理
}
|
次にCSSをヘッダー内で
input#gsc-i-id1{background: url('images/inputback.png')!important }
