wordpress添加google自定义站内搜索功能

tsai — Thu, 09 Dec 2010 06:34:06 +0000

想在wordpress中添加google自定义搜索可能有两个原因：一是wordpress本身搜索功能又慢又弱，二是有Adsense账号，这个搜索广告不用白不用，说不定还可以小弄点美刀什么的。
对于添加google自定义搜索，有三种方法：
1、把搜索结果放google页面上，这种方法通过点击站内google搜索框，然后跳转到google页面显示搜索结果，个人觉得这个方法比较不可取，因为把浏览者牵出站外了，对自己对浏览者都不是一个好的体验。本文对该方法不作描述。
2、使用 Custom Search element让搜索结果显示在站内，这种方法针对没有Adsense账户的可以用下，该搜索结果显示在站内，展现结果跟第三种方法一样。
3、把google自定义搜索框和搜索结果都放在wordpress主题中的文件，达到整过搜索过程在站内显示的目的。
一、获取google自定义搜索框及搜索结果代码
有Adsense账户的可以直接在Adsense中跟据向导生成搜索广告代码，在生成步骤中需要注意两点：
1、指定的搜索网站列表要填写正确(如果只针对自己站点搜索，输入站点地址即可)，比如:http://www.xiuchezu.com/；
2、选定搜索结果页时，可以先自己确定搜索结果页面（目前还没添加，将在下面说明），比如：http://www.xiuchezu.com/site-search，这是之后要添加生成的搜索结果代码的页面;
然后所有设置步骤完成后，会生成搜索框和搜索结果代码。
没有Adsense账户的只能使用 Custom Search element了：
1、进入www.google.com.hk/cse/，当然这个google账户必须得有（请原谅我话多）。

2、根据向导填写每个步骤的信息，要注意的是自定义搜索引擎免费版本有广告的，可以在添加后通过css处理iframe隐藏广告。
3、搜索结果的样式可以选择几个默认样式或自定义样式。下一步得到最终的搜索结果代码。

二、将生成的搜索框、搜索结果代码放到wordpress主题中。
在Adsense账户中获取的有两段代码，一是搜索框代码，另一是搜索结果代码：
1、把获取的搜索框代码替换掉主题中searchform.php文件中的form节点的所有内容，如下:

其中name=”cof”的input的 value=”FORID:11″查看google的解释，我之前设置forid值为10的时候，宽度是设置不了795以下的，改成11可以将宽度设置为600以下以适应主题。效果见本站点的搜索结果。
name=”ie”的input是输入字符的编码，取决于在生成代码过程中国家区域的选择，我之前是GB2312，输入的中文就显示乱码，改成UTF-8就OK。
修改搜索结果宽度则在搜索结果代码中修改，如下：

 var googleSearchFrameWidth = 630;

2、剩下的就是要创建搜索结果页面，处理搜索结果代码了。
新建一个文件如google-site-search.php，将要显示的博客站点框架加进来，比如head,sidebar,footer，再把搜索结果代码放到适当的地方，比如content中。
接着就要小用下wordpress的自定义页面的功能了，将如下代码添加到google-site-search.php文件的最前面。

在wordpress后台添加新页面，在模板下拉框中选择刚添加的google-site-search，修改固定链接，如:http://showyo.net/site-search/，这个链接就是刚才在上面生成代码的时候用到的搜索结果链接地址。

针对使用Custom Search element方法：
生成的代码只有搜索结果的，从建立文件到代码放置到新建页面都跟上面提到的Adsense搜索结果代码一致，不一样的是这边没有搜索框代码，但是这个是比较容易解决的，在searchform.php作小修改，只要使用“get”方法，表单结构自定义，将结果正确提交到搜索结果页面即可。类似代码如下：

然后处理下CSS，让它和你的站点水乳交融就OK乐。具体可以看下本站的google自定义搜索结果的效果哦。

风牛菜籽 » 搜索

wordpress添加google自定义站内搜索功能