このV1は2017/12/04にサービスが終了しており、以降はCustom Search Element V2を使用するものとされています。Custom Search Element API 1.0 will stop working on December 4, 2017 - Google プロダクト フォーラム
ここで解説するGoogle Custom Search APIは、Googleカスタム検索のAPIです。よってGoogle Web Search APIとは趣旨の異なるものです。またCustom Search Elementは、Custom SearchにHTMLによる出力機能を持たせたものです。
| HTMLの出力 | 使用制限 | |
|---|---|---|
| Custom Search Element | あり | なし |
| Custom Search | なし | 1日のクエリは100回まで。これを越える場合は有料 |
| メソッド | 説明 |
|---|---|
| setResultSetSize | 結果の数を設定する。指定値は、
|
| setSearchStartingCallback | 検索開始時に呼び出されるメソッドを設定する |
| setSearchCompleteCallback | 検索完了時に呼び出されるメソッドを設定する |
| draw | 検索フォームと検索結果を表示する |
| startHistoryManagement | タブの変更や検索の実行を、ブラウザの履歴に記録するようにする |
google.search.CustomSearchControl(
cseId, // CSE ID (カスタム検索エンジンID)
opt_options // 検索のオプション設定
);
cseIdには、カスタム検索エンジンIDを指定します。
var options = {
enableImageSearch: true,
defaultToRefinement: 'LABEL_1'
};
options[ google.search.CustomSearchControl.autoCompleteOptions ] = { matchType: 'any' };
options[ google.search.Search.RESTRICT_EXTENDED_ARGS ] = { lr: 'lang_ja', sort: 'date' };
var customSearchControl
= new google.search.CustomSearchControl( id, options );
オプション名がプロパティで定義されているものは、連想配列の形式で指定する必要があります。
| パラメータ | 説明 | 指定可能な値のリスト |
|---|---|---|
| lr | 言語 | Language Collection Values |
| cr | 国
Google Web検索は、
から国を判別している。 cr - XML API reference |
Country Collection Values |
| gl | 地方 | Country Codes |
customSearchControl.setSearchStartingCallback(
this,
function( searchControl, searcher, query )
{
//
} );
検索キーワードをGoogle Analyticsで記録するには、このハンドラでキーワードqueryを取得して、トラッキングコードをカスタマイズします。Google アナリティクスのサイト内検索の設定 - カスタム検索 ヘルプ
customSearchControl.setSearchCompleteCallback(
this,
function( searchControl, searcher )
{
//
} );
検索履歴を有効にすると、タブの変更や検索の実行がブラウザの履歴に記録されるようになり、ブラウザの「戻る」や「進む」で検索履歴をたどれるようになります。ただしこの機能はIE6とIE7では利用できません。
// 先にコントロールを描画する customSearchControl.draw( 'cse-search-form' ); var historyStarted = customSearchControl.startHistoryManagement( function() { // 必要ならば、ここで既定のクエリで検索を実行する // ここでの検索は履歴に記録されない customSearchControl.execute( defaultQuery ); } ); if( historyStarted ) { // 履歴が有効ならば、検索結果のページから戻ったときには、その検索を実行した状態に確実に戻れるため // 検索結果を同一ウィンドウに表示するようにする (必ずしも同一ウィンドウに表示する必要はない) customSearchControl.setLinkTarget( google.search.Search.LINK_TARGET_SELF ); }
WebSearchおよびImageSearchオブジェクトにより、検索結果をカスタマイズできます。これらのオブジェクトはCustomSearchControlオブジェクトの2つのメソッド、
により取得できます。
var webSearcher = customSearchControl.getWebSearcher(); webSearcher.setResultSetSize( google.search.Search.SMALL_RESULTSET );
作成したDrawOptionsオブジェクトをCustomSearchControl.draw()の引数に与えることで、コントロールに設定を適用させます。
var drawOptions = new google.search.DrawOptions(); drawOptions.setAutoComplete( true ); drawOptions.enableSearchboxOnly( '/search/' ); customSearchControl.draw( 'results', drawOptions );
| メソッド | 説明 |
|---|---|
| setAutoComplete | trueのとき、キーイベントでオートコンプリートが有効となる |
| enableSearchboxOnly | 検索結果を新しいページで表示する |
enableSearchboxOnly(
resultUrlPrefix, // 結果ページのURL
opt_queryParamName, // クエリパラメータの名前
opt_newWindow, // trueのとき、結果ページを新しいウィンドウで開く
opt_paramSeparator // URLのパスとクエリの区切り文字
)
※結果ページを新しいウィンドウで開くとき、ブラウザの設定によってはポップアップとしてブロックされることがあります。
<div id="cse-search-form">Loading</div>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load( 'search', '1', { language : 'ja' } );
google.setOnLoadCallback( function()
{
var cseId = 'partner-pub-00000:xxxxx';
var customSearchControl
= new google.search.CustomSearchControl( cseId );
customSearchControl.draw( 'cse-search-form' );
},
true );
</script>