WEB制作(html・css(スタイルシート))に関する各種メモ書き

サイト内検索ASPの代わりにGoogle AJAX Search API を使用する。

サイト内検索ASPはサイト内ページが多いと結構高額になります。

そこでサイト内検索ASPの代わりにGoogle AJAX Search API を使用して構築してみましょう。

1. http://code.google.com/intl/ja/apis/loader/signup.html へアクセス

2. サイトのURLを入力

3. 表示されるサンプルをコピペ

でサンプルhtmlが出来上がります。

出来上がったhtmlは先ほど入力したURL内(本番サーバ)でしか動作しないので本番サーバへアップ。

表示のカスタマイズは以下のとおりです。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>My Google API Application</title>
<script src="https://www.google.com/jsapi?key=■API KEY" type="text/javascript"></script>
<script language="Javascript" type="text/javascript">
//<![CDATA[
  google.load("search", "1");
  function OnLoad() {
    var searchControl = new GSearchControl();
    var siteSearch = new GwebSearch();
    //8件に変更する場合は以下を記述。
    searchControl.setResultSetSize(GSearch.LARGE_RESULTSET);
    //オプションを追加
    options = new GsearcherOptions();
    //検索結果を表示する
    options.setExpandMode(GSearchControl.EXPAND_MODE_OPEN);
    siteSearch.setUserDefinedLabel("my_ラベル");
    siteSearch.setSiteRestriction("■http://xxxxxx.xxxxx.xxxxxxx");
    siteSearch.setUserDefinedClassSuffix("siteSearch");
    searchControl.addSearcher(siteSearch, options);  
    searchControl.draw(document.getElementById("searchcontrol"));
  }
  google.setOnLoadCallback(OnLoad);
//]]>
</script>
</head>
<body>
<div id="searchcontrol">Loading...</div>
</body>
</html>

No.823
10/20 14:19

edit