WordPress整合百度站内搜索和谷歌自定义搜索,替换掉WordPress默认搜索

[ wordpress教程   // 2015-05-04 00:00:00  ]
 

wordpress自带的默认搜索功能会增加数据库查询次数,于是网上出现了很多关于 WordPress 整合谷歌自定义搜索和百度站内搜索的文章。不过从去年开始谷歌在国内间歇性被土啬阻断,导致越来越多的朋友选择WordPress整合百度站内搜索来替换掉WordPress默认搜索!下面奇芳阁就总结一下WordPress分别整合百度站内搜索和谷歌自定义搜索的方法!

WordPress整合百度站内搜索:

听说添加百度站内搜索,有助于收录,你值得拥有!本篇文章理论上适用于任何带搜索功能的网站,如果你是用wordpress建站,那么恭喜你,你可以完全照搬了!

1、登入百度站内搜索官网:http://zn.baidu.com 注册一个账号。

2、登录百度站内搜索以后,直接点击“添加新的搜索引擎”。

百度站内搜索引擎

3、选择一个设置搜索框的名称、搜索生效范围等基本信息。

4、在下方,可以基础样式设置和高级样式设置中可以设置搜索框的大小、按钮大小以及外观等。

5、进入百度站内搜索的“结果页管理”中,选择“嵌入式搜索结果”,在“嵌入式搜索结果”最下方的高级样式设置中设置显示搜索结果的页面,例如奇芳阁的:http://www.softhome.cc/html/search。一个搜索框最多只能设置一个跳转地址。若您需要为不同的搜索框设置不同的搜索结果地址,可以点击高级样式设置中的“添加规则”。

6、然后先添加一个你想展示搜索结果的页面,对于Wordpress,找到你的Wordpress主题下的search.php,如果没有找到你还可以自己创建一样这样的文件,把这个search.php中的判断语句给删除了,然后用百度站内搜索嵌入式搜索的代码替换它

7、最后就是为你的网站添加搜索框,即实现当用户在任意页面点击搜索后就能跳转到搜索结果展示页。

在使用自己的搜索框进行搜索时把必需的参数提交到部署了嵌入式搜索结果代码的页面。嵌入式结果页代码将获取当前页面地址中的参数部分即“?”后面部分。其中必要的参数是“q”,即query,也就是用户输入的关键词。此外的参数都是非必需参数。若您在www.example.com下部署了嵌入式结果页代码,输入关键词“免费”搜索时地址可能为www.example.com?q=免费

8、实现上述效果的代码,示例如下:

<form target="_blank" action="www.wugongqi.cn(部署了嵌入式结果页代码的页面地址)">
<input name="q" type="text">
</form>

9、以下是奇芳阁正在使用的Form表单提交搜索代码,有兴趣的朋友可以参考一下:

<form method="get" class="qfg_search_form" action="http://www.softhome.cc/html/search">
<input class="qfg_search_box" type="text" name="q" id="s" class="input" value="输入关键字..." onBlur="if(this.value=='') this.value='输入关键字...';" onFocus="if(this.value=='请输入关键词') this.value='';" />
<input class="qfg_search_btn" name="submit" type="submit"  value="搜索" />
</form>

百度站内搜索嵌入式搜索自定义参数:

1、百度站内搜索嵌入式搜索代码中提供了参数自定义功能,结果页横向排版、结果页高度、网页字符编码、搜索结果页宽度等进行定义,参数说明如下:

2、bdcsFrameWt:结果页横向排版。

默认为:1,隐藏左侧筛选排序,隐藏logo区域,隐藏右侧广告。

设置为:2,显示左侧筛选排序,显示 logo区域(需要bdcsFrameHt值为2),隐藏右侧广告。

设置为:3,隐藏左侧筛选排序,隐藏logo区域,显示右侧广告。完整的结果页模块示例简图如下:

3、bdcsFrameHt:结果页纵向排版。默认为:1,隐藏顶部搜索框。设置为:2,显示顶部搜索框

WordPress整合谷歌自定义搜索:

整合Google自定义搜索有两种办法,一种是替代Wordpress自带的默认搜索框,一种是不替换,直接使用默认的搜索框。现在很多主题的界面UI非常美观,而且拥有精美搜索框的主题也不在少数,如果让你放弃原先精美的搜索框,而用 Google 那简单单一的搜索框是不是会有点不舍呢?今天就分享一下可以在不修改原搜索框的前提下使用Google 强大的自定义搜索功能。

1、首先需登录http://www.google.com/cse/,添加自己的站点信息,及关联必要的Adsense账户,如果没有Adsense无需关联。

2、创建完成后,在点击左侧的“外观”并选择“全宽”的布局模式,获得你的 Google 自定义搜索代码:

<!-- Put the following javascript before the closing </head> tag. -->
<script>
(function() {
var cx = '你的自定义搜索ID';
var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com.hk/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];

   s.parentNode.insertBefore(gcse, s);
})();
</script><!-- Place this tag where you want the search results to render -->
<gcse:searchresults -only></gcse:searchresults>

3、创建搜索结果页    为了让搜索结果在博客内部显示,我们需要在 WordPress 中创建一个新的页面,用来显示搜索的搜索结果。如果本身主题带有search.php,修改代码即可。如果没有,文件内容复制下面的即可。

<?php
/*
Template Name: 网站搜索模板
*/
?><?php get_header(); ?><div id="main">
<div id="content">
<div class="container"><!-- Put the following javascript before the closing </head> tag. -->
<script>
(function() {
var cx = '你的自定义搜索ID';
var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com.hk/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s);
})();
</script>

<!-- Place this tag where you want the search results to render -->
<gcse:searchresults -only></gcse:searchresults>
</div>  <!---end of container-->
</div>  <!---end of content-->
<?php get_footer(); ?>
</div>

其中将“你的 Google 自定义搜索 ID”替换为 Google 给你的“搜索引擎的唯一 ID”,可以在控制面板的基本信息内获取。

保存后将 search.php 上传至你的主题根目录下。

最后在你博客的后台 – 页面中新建页面,在页面属性的模版中找到 网站搜索模版 并选择,写好标题发布即可。

4、最后就是修改当前主题的搜索提交的表单

这里我们需要在主题文件夹中找到搜索框所在的文件,每个主题都不同,有的在sidebar.php里,有的在searchform.php里,也有的在header.php里面,请仔细查找下就可找到。在文件中找到类似如下代码:

<form method="get" id="searchform" action="http://www.softhome.cc/html/search">
<input class="sousuo" type="text" value="" name="q" onfocus="if (this.value == '') {this.value = '';}" onblur="if (this.value == '') {this.value = '';}" />
<input class="searchBtn" type="submit" id="searchsubmit"  value="搜索吧"/>
</form>

action 的地址根据你自己创建的搜索页面的链接来修改,只要保证能访问到我们刚新建的页面就行;不管你原先主题搜索框的 name 等于什么,都将引号内的字母改成 q。

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

www.000webhost.com