グーグル（Google）

googleカスタム検索は無料で自サイトに簡単に設置できサイト内検索になるので便利な検索ボックスだ

2013.12.01
この記事は約3分で読めます。

グーグルカスタム検索

グーグルのカスタムサーチは無料で自サイトに設置できる検索ボックスである。カスタムサーチの検索ボックスはカスタマイズの自由度が高く、サイト内検索として設置することも容易。自社で複数のドメインを管理している場合は、その複数のドメインに関する検索結果だけを表示することもできる。もちろん広く一般サイトの検索結果も表示できるが、その場合でも自サイトのほうを優先的に表示するようなカスタマイズもできる。グーグルのアカウントがあればログインして設定し、表示されたhtmlコードを自社サイトに貼り付けるだけで利用できるようになる。

▼グーグルカスタム検索の画面（グーグルにログインしていない場合）
グーグルカスタム検索

グーグルカスタムサーチの設定は「http://www.google.co.jp/cse/」にアクセスし、グーグルアカウントでログインすれば設定画面になる。

設定を行い「コードを取得」すると以下の様なコードが出力される。

<script>
(function() {
var cx = ‘007308******3867130:******-****’;
var gcse = document.createElement(‘script’);
gcse.type = ‘text/javascript’;
gcse.async = true;
gcse.src = (document.location.protocol == ‘https:’ ? ‘https:’ : ‘http:’) +
‘//www.google.com/cse/cse.js?cx=’ + cx;
var s = document.getElementsByTagName(‘script’)[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:search></gcse:search>

※オレンジ色の部分（var cx = ‘007308******3867130:******-****’;）は個別のIDになるので各自が違うので注意。

実際に設置すると以下のように表示される。

サイト内検索

（グーグルカスタム検索）

▼設定のオプション（引用元：https://developers.google.com/custom-search/docs/element）

オプション 成分（単数または複数）
全角で <gcse:search>
コンパクト <gcse:search>
二段 <gcse:searchbox>、<gcse:searchresults>
二ページ

 <gcse:searchbox-only>、最初のページに<gcse:searchresults-only> 2ページ目（または他のコンポーネント）。
結果のみ

 <gcse:searchresults-only>
Googleがホストする

 <gcse:searchbox-only>

▼設定が完了したときの画面

googlesearchログイン後