since.2006  

以前一直用的是老版本google自定义搜索,可自定义的功能很少。最近趁blog用twitter bootstrap重写时顺便将google自定义搜索功能也更新一把,网上的教程比较繁琐,自己折腾了一晚上,找到一个超简单集成的方法。

简单2步即可完成基本整合功能:
1. 通过Google Custom Search element网页自动生成基本的搜索代码。

2. 添加到网页中,做一些自定义修改,上传收工。

俺的整合代码(效果见右侧搜索功能):

<!-- Google Custom Search Element -->
<!-- 注意两个id:cse-search-form 和 cse-search-result -->
<!-- cse-search-form: 搜索框显示的地方 -->
<!-- cse-search-result: 搜索结果显示的地方 -->

<div id="cse-search-form" style="row-fluid"></div>
<div id="cse-search-result" style="row-fluid"></div>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
    google.load('search', '1', {
        style: google.loader.themes.MINIMALIST
    });
    google.setOnLoadCallback(function () {
        var cse = new google.search.CustomSearchControl();
        var drawOpts = new google.search.DrawOptions();
        drawOpts.setSearchFormRoot("cse-search-form");
        cse.draw('cse-search-result', drawOpts);
    }, true);
</script>

更多高级设置可以参考Custom Search Reference

 

Posted by hee at 23:03 PM | Permalink | 评论(0)