很多朋友都问搜索制作方法,其实方法来自自力博客,下面的全系转载如若不明可去自力上咨询!转自: 《WordPress整合Google自定义搜索》
具体方法:
1、用 Google帐号登录 http://www.google.com/cse/
2、创建一个 自定义搜索引擎,填写相关信息,选择标准版,搜索网站 填写如下格式:
www.hzlzh.com/*3、进入控制面板 可以获得,诸如:搜索引擎的唯一 ID: 011726169853656484522:gvikl69lrew
———– 分 割 线 ———-以下开始在WordPress中操作————
4、(又要用到Wordpress页面模版这个功能,不了解的可以看这里 WordPress页面模板的使用及短代码调用 )
在桌面创建一个名为 cse.php 的文件,之后上传到 WP 主题目录中,[注意这里的代码不完全是Google 生成的,添加了正则传参部分]文件内容如下:<?php /* Template Name: cse */ ?> <?php get_header(); ?> <div> <div> <div id="cse" style="width: 100%;">正在从Google 加载搜索结果......</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('011726169853656484522:gvikl69lrew'); customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET); customSearchControl.draw('cse'); var match = location.search.match(/q=([^&]*)(&|$)/); if(match && match[1]){ var search = decodeURIComponent(match[1]); customSearchControl.execute(search); } }); </script> <link rel="stylesheet" href="http://www.google.com/cse/style/look/greensky.css" type="text/css" /> </div> <?php get_sidebar(); ?> </div> <?php get_footer(); ?>5、在WP后台新建一个页面,名字随便,选择页面模板 cse 就是刚刚传上去的那个文件。之后点击发表页面,但隐藏显示。
访问:新建的页面,诸如:http://www.hzlzh.com/search 这个是hzlzh 建的那个页面。此时你会发现出现了以个google的搜索条,并且可以使用了。6、现在我们有了一个正常使用的search 页面,下面开始对首页的搜索条进行修改,注意上面和下面代码中 红色部分,这个根据不同的博客,不一样,用了一个正则来处理传递参数,比如hzlzh的:
<form method="get" id="searchform" action="http://www.hzlzh.com/search"> <div><input type="text" value="Click Enter..." name="q" id="search_input" onfocus="this.value = this.value == this.defaultValue ? '' : this.value" onblur="this.value = this.value == '' ? this.defaultValue : this.value" /></div> <div><input type="submit" alt="search" id="search_button" /></div> </form>7、大功告成,现在你要做的就是优化 CSS,使之看起来跟你的博客很搭!在Google控制面板选择 [外观]-[搜索元素]-[压缩视图]-[自定样式]
8、如果是主题作者,建议在后台加入search选项,集成这个功能,唉~~折腾!
评论(6)
哈哈~留个脚印先!
哈哈~留个脚印先!
哈哈~留个脚印先!
学习了,正好用得着
学习了,正好用得着
学习了,正好用得着