在 WordPress 中整合 Google 自定义搜索引擎
虽然 WordPress 自带有一个站内搜索引擎，但是性能比较低下，而且还会占用服务器资源。所以还不如利用 Google 提供的自定义搜索引擎，将其集成到我们的博客中来。
第一步：注册 Google 自定义搜索引擎
首先，我们需要到Google上面去注册一个自己的搜索引擎。访问http://www.google.com/cse/，用你的 Google 账户登录之后，创建新的搜索引擎。创建完毕后进入”外观”面板，这里选择”全宽”布局。保存后进入”获取代码”,获得如下代码:
<?php
/*
Template Name: search
*/
?>
<?php get_header(); ?>
<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 : ‘zh-CN’});
google.setOnLoadCallback(function() {
var customSearchControl = new google.search.CustomSearchControl(’005173058427090287855:djmrkortfdw’);
customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
var options = new google.search.DrawOptions();
options.setAutoComplete(true);
customSearchControl.draw(‘cse’, options);
}, true);
</script>
<link rel="stylesheet" href="http://www.google.com/cse/style/look/default.css" type="text/css" />
<?php get_footer(); ?>
第二步：创建搜索结果页
为了让搜索结果在博客内显示，我们需要在 WordPress 中创建一个新的页面，作为搜索结果展示的页面。我们创建一个叫做search.php（文件名无所谓）的模板文件，可视乎你的模板调整，内容如下:
<?php
/*
Template Name: search
*/
?>
<?php get_header(); ?>
<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 : ‘zh-CN’});
google.setOnLoadCallback(function() {
var customSearchControl = new google.search.CustomSearchControl(’005173058427090287855:djmrkortfdw’);
customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
var options = new google.search.DrawOptions();
options.setAutoComplete(true);
customSearchControl.draw(‘cse’, options);
}, true);
</script>
<link rel="stylesheet" href="http://www.google.com/cse/style/look/default.css" type="text/css" />
<?php get_footer(); ?>
接着在后台新建页面，别名设置为 search ，在右侧选择模板 search ，提交保存。
第三步：修改站内搜索提交表单
接下来我们要做的事情，就是当用户点击你网站上任意页面的站内搜索按钮的时候，将用户引导到你刚刚创建的搜索结果页上。在主题文件夹中找到相应的模板页，在模板页中找到站内搜索相关的代码:
<form method="get" action="/search">
<input type="text" size="24" name="q" value="搜索文章…." class="textfield" style="float:left" onblur="if (this.value == ”) {this.value = ‘搜索文章….’;}" onfocus="if (this.value != ”) {this.value = ”;}"/>
<input class="submitSearch" type="submit" value="Search"></input>
</form>
这里主要修改 method=”get” action=”/search”，还有文本框 name=”q”
第四步：初始化搜索关键字
现在我们要做的事情就是，先从Url中提取用户搜索的关键词，然后调用 Google API 使用此关键词进行搜索。
打开刚才新建的search.php，在 Google 的代码 customSearchControl.draw(‘cse’, options); 后插入以下代码:
var match = location.search.match(/q=([^&]*)(&|$)/);
if(match && match[1]){
var search = decodeURIComponent(match[1]);
customSearchControl.execute(search);
}
在上面的代码中，先使用正则表达式提取出来 URL 中的关键词，并使用 UTF-8 解码，然后让 Google 执行搜索。实际使用中，你需要确认你网站上使用的 URL 搜索参数是不是 q ，如果不是，那么需要将上述的正则表达式中的q改成你自己定义的参数。