スタートページJavascript

Google Search:特定Webサイト検索窓の作成

検索対象を特定のWebサイトに限定した検索窓をWebページに作成する方法です。
検索窓から検索情報をGoogle検索エンジンのサイトに送り、検索そのものはGoole側で行い、その結果を送り返すしくみです。

これには二つの方法があります。
    HTMLフォームの利用
    Google Custom Search

Googleは、これまでにも検索窓作成のために、多様な手段を公開提供してきましたが、Google Custom Searchに統合し、それへの移行を進めています。「HTMLフォームの利用」は手軽で広く利用されているので、存続するらしいです。


「検索エンジンID」の取得

大規模ビジネス用のWebページや有料閲覧のページなど以外のページに検索窓を設置するには、無料ですが、原則として、Googleから「検索エンジンID」(123456789:abcdefghijのような形式)を取得する必要があります。

検索エンジンIDは、Googleのサイト「検索エンジンID」 https://support.google.com/customsearch/answer/2649143から取得できます。

HTMLフォームの利用

標準的な検索機能だけでカスタマイズはできません。
Googleの参照サイト「HTMLフォームを使用した検索ボックスの作成」 https://support.google.com/customsearch/answer/1351747?hl=jaで公開しているHTMLのFormコードをHTMLに組み込むだけで実現できます。
限定Webサイトだけでなく、Web全体を対象にすることができます。
通常の用途ならば、手軽なこの方法で十分でしょう。

原則的には検索エンジンIDが必要ですが、実際には、それがなくても利用できるようです。

実装例:「FormによるGoogle検索窓の実例」

Google Custom Search

これには次の2つがあります。どちらも検索エンジンIDが必須です。
    Custom Search Elements
    Custom Search Element Control

検索エンジンIDについて
私は理解が不十分なのですが、検索エンジンIDは検索対象Webサイトごとに必要なようです。 検索エンジンIDを指定すると、検索対象Webサイトが自動的に決まります。
また、自分のサイトだけでなく、第三者のサイトを対象とすることもできそうです。

実装例について
まだよく勉強をしていません。Googleサイトでの例示を、単純にコピー・ペーストしただけの状態です。
参照:Google「Custom Search Element V2」
   http://www.crystal-creation.com/web-appli/technical-information/web-api/google/search/web/custom-search/v2.htm

Custom Search Elements

検索機能は、標準的なスクリプトが指定されるのですが、HTML側での指定が多様になります。
「HTMLフォームの利用」では、FORM内で検索窓が固定し結果は他ファイルに標準的な表示がされていましたが、Custom Search Elementsでは、検索窓と表示位置(ページ内に表示)を分離したり、表示形式を指定したりできます。

実装例:「Custom Search Elements V2の実例」

Custom Search Element Control API

Custom Search Element Control API は、Custom Search Elementsの各種パラメタをJavascriptで指定するためのAPIです。
Custom Search Elementsをベースにして、多様なオプション機能を実現するスクリプトを記述するためのAPIが示されています。

実装例:「Custom Search Element Control API (V2)の実例」