| ブログトップ | API関連 | JavaScript関連 |

Googleカスタム検索

この記事は1年以上前の記事のため、内容が古い可能性があります。

自分のサイトにGoogleサイト内検索フォームを設置できる「Googleカスタム検索」
この検索フォームの仕様が変わったようです。

Googleカスタム検索はこちらから設定を行えます。↓

http://www.google.co.jp/cse/

設定を行うと、以下のようなコードが出力されます。(以下のコードはこのサイト用に設定したコードなので転用しても意味がありません。あしからず。)

<div id="cse" style="width: 100%;">Loading</div>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
   google.load('search', '1', {language : 'ja'});
   google.setOnLoadCallback(function() {
      var customSearchControl = new google.search.CustomSearchControl('006668502882474005811:hojvzo2b0qm');
      customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
      customSearchControl.draw('cse');
   }, true);
</script>

で、張り付けた結果がコレ↓
     

Loading

検索するとフォームのすぐ下に結果がリストされるようになりました。

う~ん・・・正直今まで通りで十分なんだけどなぁ。

という人は、「検索エンジンID」だけ拝借して今までどおりのコードに適応。
「検索エンジンID」というのは上のコードの赤文字で記述されている部分です(設定ごとにこのIDは変わります。)。このIDを以下のコードの赤文字の部分に記述してください。

<form action="http://www.google.com/cse" id="cse-search-box" name="cse-search-box">
   <input type="hidden" name="cx" value="検索エンジンID" />
   <input type="hidden" name="ie" value="UTF-8" />
   <input type="text" name="q" size="21" value="" />
   <input type="submit" name="sa" value="検索" />
</form>
<script type="text/javascript" src="http://www.google.com/cse/brand?form=cse-search-box&amp;lang=ja"></script>

結果↓

日々の生活にhappyをプラスする|ハピタス

このエントリーをはてなブックマークに追加

LINEで送る

トラックバック

トラックバックURL

コメントする

※メールアドレスが公開されることはありません。

名前 *
メール*
URL
Copyright(c) 2010 - 2024 ダリの雑記