将 Google 自定义搜索整合到自己的 WordPress 中

11
Sep

将 Google 自定义搜索整合到自己的 WordPress 中

网站建设相关Sep 11th, 2008binyan17

19fbf7e0 整合 Google 自定义搜索到 WordPress 中好像有很多好处，可以减少数据库查询，因为搜索结果是 Google 提供的，不用再去数据库中搜索了。能够更加全面的搜索，WordPress 目前只能搜索 post。另外还可以在搜索结果中绑定 Google Adsense 赚钱。嗯，很爽，那么如何整合 Google 自定义搜索到 WordPress 中。步骤如下：

1. 在 WordPress 中创建一个页面，然后再在导航栏中设置为不显示该页面，如果你是用 wp_list_pages() 这个函数输出页面的，你可以使用 exclude 这个参数把刚才创建的页面剔除出去。

2. 登录到 Google自定义搜索，创建你的自定义搜索。

3. 在输入你的基本信息和网站之后，来到代码 tab 页面。详细配置如下：

4. 搜索结果托管选项选项：选择在非 Google 网站上托管结果，然后选择 iframe

5. 指定搜索结果详情：输入你第一步创建页面的页面的地址。如我的：http://www.tvwz.com.cn/search

6. 然后用搜索框代码替换你原来的 WordPress 搜索框代码。你需要根据你自己的 WordPress 搜索框的样式对这段代码做下修改，以适合你的主题。此时应该注意的是，如果你改了form标签的CSS ID值，那么一定要注意在相关的地方也要改掉，下面是我的代码：

<form action="http://www.tvwz.com.cn/search" id="searchform">
  <div>
    <input type="hidden" name="cx" value="003179277523482928420:zylrnlopzmi" />
    <input type="hidden" name="cof" value="FORID:11" />
    <input type="hidden" name="ie" value="UTF-8" />
    <input type="text" name="q" id="s" size="31" />
    <input type="submit" name="sa" id="searchsubmit" value="Search"/>
  </div>
</form>
<script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box&lang=zh-Hans"></script>

上面的我就把form的id 改成了searchform,以及submit的id改成了searchsubmit，这里很重要，结果页的调用：

<div id="cse-search-results"></div>
<script type="text/javascript"><!--
  var googleSearchIframeName = "cse-search-results";
  var googleSearchFormName = "searchform";
  var googleSearchFrameWidth = 530;
  var googleSearchDomain = "www.google.com";
  var googleSearchPath = "/cse";
// --></script>
<script src="http://www.google.com/afsonline/show_afs_search.js" type="text/javascript"></script>