给你的 WordPress 添加 Google 自定义搜索

由于上周临时抱佛脚一心准备考试,罢工了一周,now,我们继续。
上周 surfone 童鞋在论坛里求助如何为Wordpress 添加 Google 自定义搜索这个问题,酋长这段时间工作繁重可能无法顾及,教程一直没有放出,对不住大家了。刚好我一直倾向于使用 Google 自定义搜索引擎来代替 WordPress 自带的搜索功能,我曾经在我修改的 Mozilla for WordPress Theme 中就这样干过,那么这么做有什么好处呢:

  1. WordPress 本身的搜索功能还比较弱,搜索结果不太准确
  2. WordPress 本身的搜索功能需要查询数据库,每次查询都会增加服务器负担
  3. 还可以利用 Google 自定义搜索赚点小钱

不同的是,在 Mozilla for WordPress Theme 中我只是简单把搜索结果托管在 Google 的网页上,这次我们要将它托管在自己的博客页面上。酷吧?那就一起一起来把它加在 WordPress 上吧:

  1. 首先我们得利用 Google 自定义搜索引擎建立一个自己的搜索引擎
  2. 访问:Google 自定义搜索引擎点击“创建自定义搜索引擎”即可创建属于你自己的搜索引擎啦(已有自定义搜索引擎的请略过此步)。具体新建过程我也不再赘述,相信大家能搞定。

  3. 选择 Google 自定义搜索引擎样式
  4. 创建好自定义搜索引擎后,一次点击“控制面板”-“外观”,选择第一种无边框、无背景色的样式即可,因为最后都要使用自己的 WordPress 主题来自定义的。
    给你的 WordPress 添加 Google 自定义搜索

  5. 获取 Google 自定义搜索引擎代码
  6. 点击“代码”,在“搜索结果托管选项”下选择“在您的网站上托管搜索结果:”–“iframe – 需要两个网页:一个网页提供搜索框,另一个提供结果”

    “指定搜索结果详情”选项需要填写搜索结果所在的网页地址并选择广告位置

    选择完毕我们就可以得到自己的 Google 自定义搜索引擎代码了
    给你的 WordPress 添加 Google 自定义搜索

  7. 自定义搜索框代码
  8. 得到上面的搜索框代码后,我们还需按照自己的 WordPress 主题样式进行修改,才能使 Google 自定义搜索和主题相匹配。
    我所使用的 Blueweed 主题的搜索框 Searchform 代码是:


    稍加改动,去掉id=”cse-search-box”并合并一下input type的各个属性,大家照葫芦画瓢即可,最终代码如下(可能会因主题不同而有差异):


    注意,请将 input type=”hidden” name=”cx”、input type=”hidden” name=”cof”、input type=”hidden” name=”ie”放到 input type=”text” name=”q” id=”s”后面,以免搜索框变形

  9. 自定义搜索结果代码
  10. 定义好搜索框后,我们只需自定义搜索结果就可以宣布大功告成了。要使 Google 自定义搜索显示到 WordPress 上,我们需要建立一个搜索结果页面模板,打开 page.php,在最前面添加:

    < ?php /* Template Name: Google Custom Search Results */ ?>

    以定义该页面模板名称,然后找到

    < ?php the_content(); ?>

    用先前得到的搜索结果代码替换它并另存为Google-Custom-Search.php即可

  11. 在搜索结果上放置自己的 ADsense 广告
  12. 回到 Google 自定义搜索控制面板-赚钱,按照要求填入自己的帐号信息即可
    给你的 WordPress 添加 Google 自定义搜索

  13. 最后,新建搜索结果页面
  14. 进入 WordPress 后台,撰写一个名为“Search”的新页面,命,缩略名(slug name)为:search,页面模板选择刚刚上传的 “Google Custom Search Results”

好了,经过以上几步,我们就成功为 WordPress 添加 Google 自定义搜索了,具体演示详见本人博客:thirdinfo.com
其实 surfone 童鞋自己已经 Google 找到 zEUS.童鞋那里,三下五除二就把问题解决鸟(hoho,大家要向surfone 童鞋学习)。大家也可以看看 zEUS. 的教程