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

2008年10月23日00:11:06 技术分享 31 18,248

由于上周临时抱佛脚一心准备考试,罢工了一周,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 – 需要两个网页:一个网页提供搜索框,另一个提供结果”
    给你的 WordPress 添加 Google 自定义搜索
    “指定搜索结果详情”选项需要填写搜索结果所在的网页地址并选择广告位置
    给你的 WordPress 添加 Google 自定义搜索
    选择完毕我们就可以得到自己的 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. 的教程

评论已关闭!

目前评论:31   其中:访客  31   博主  0

    • fishtimes fishtimes 4

      学习ing

      • EaSy EaSy 5

        恩。这个不错,鱼辛苦了!

        • 辐射鱼 辐射鱼 6

          @fishtimes GG收录你的站快不?快的话就替换掉吧

          • louis louis 5

            职业撒花的来了。

            • fishtimes fishtimes 4

              @辐射鱼
              我觉着超级快啊
              发了文章gg就有了。。。
              可能是用了All in One SEO的缘故

              • 菠菜 菠菜 4

                好文章,貌似在博客中用到的搜索还不多。我的统计中没太看出来。

                • 辐射鱼 辐射鱼 6

                  @fishtimes @fishtimes 保持更新GG一般收录都较快,不关All in one seo 的事,相反,我不赞成使用这个插件

                  • 辐射鱼 辐射鱼 6

                    @菠菜 嗯,毕竟博客内容不多,分类、标签等内容就满足绝大多数需求了,但内容多了,搜索的优越性就出来了

                    • 色の达西 色の达西 3

                      不得不承认鱼童鞋的文章总是很有看头,希望从他那里学习,我能有所进步。

                      • 老N 老N 6

                        @fishtimes 我倒是觉得用google xml sitemap有这个效果。

                        • 辐射鱼 辐射鱼 6

                          @老N 老N同志说得很对,哈哈

                          • maxsailor maxsailor 4

                            这个要好好的瞅瞅。

                            • 辐射鱼 辐射鱼 6

                              @maxsailor 欢迎测试,具体效果看本人博客

                              • fishtimes fishtimes 4

                                @老N
                                那个比较诡异
                                当初只用它的时候
                                时好时坏

                                • Bryan Bryan 3

                                  不是快不快的问题,是这样搜索能带来cash

                                  • 戏子 戏子 0

                                    我就是用的google 自定义搜索替代了wp的搜索,可是广告太多了…有时候广告比我站内结果还多.

                                    演示:http://www.renzha.net

                                    • 流星 流星 2

                                      对着网生志的教程折腾了一个小时,最后还是无奈承认我失败了

                                      • 辐射鱼 辐射鱼 6

                                        @流星 不至于那么难吧?10分钟搞定的事情

                                        • 流星 流星 2

                                          @辐射鱼 我对着改动了,主题不一样,所要寻找的代码位置不同
                                          都修改了,页面创建了,隐藏了,搜索了,发现还是wp的……
                                          白天醒了空了继续搞下,似乎有点发现我应该尝试替换另外一个文件

                                          • 辐射鱼 辐射鱼 5

                                            @流星 form action一定要是yourblog.com/search_page哈

                                            • 流星 流星 2

                                              @辐射鱼
                                              又认真看了下,我搜索结果显示的是index.html页面,而不是我指定的search页面
                                              哎,很痛苦
                                              想修改下默认关于页面,不让显示那个“编辑”按钮,结果找不到这个页面在哪里修改

                                              • 辐射鱼 辐射鱼 6

                                                @流星 我在上面就已经提示你了……

                                                • 流星 流星 2

                                                  但我的form action确实没有写错

                                                  • jinlin jinlin 3

                                                    @流星 编辑按钮不是single里面那个吗?
                                                    今天最成功的就是找着这个启用了我的Google自定义搜索哈,太爽了……虽然我的博客刚建,Google还没有收录~~~汗……
                                                    之前看你这个教程的时候没搞懂,之后看zEUS. 的,他那个和我主题完全不搭嘎,今天才发现你这个和我的主题基本一致,没办法,完全不懂语言,只能这样混了~~~
                                                    哪天青辐射鱼帮忙优化哈我的博客喔~~~

                                                    • 辐射鱼 辐射鱼 6

                                                      @jinlin 就 form action、text这些改一改,没那么难吧?总而言之,弄好就对

                                                      • Joe Chik Joe Chik 4

                                                        怎么才算有”自定义搜索引擎”啊?指的是GG Adsense里的吗?

                                                        • 请问下 请问下 0

                                                          请问下您这个留言用的是什么插件呢

                                                          • 断峰狼 断峰狼 0

                                                            赚钱才是王道!自定义搜索可以赚钱的嘛~~~

                                                            • 暖风 暖风 1

                                                              请问有这么个问题,自定义搜索框在后台编辑自定义样式可选项太少了,到了博客里不不能自定义,因为会优先下载google的自义定css,请问可不可以把代码里的id 及class名称修改后,用自义定css改变样式?

                                                              • 暖风 暖风 1

                                                                谢谢酋长啊,不过我从google自定义那边下载下来的css太长了,不知道修改哪里了,