改变WordPress默认搜索小工具样式

知更鸟 2011年10月6日01:15:506918.2K5
摘要

  鉴于近期Google搜索变得极不稳定,HotNews Pro 主题集成的Google自定义搜索功能,也时常失去作用,无法显示搜索结果。
  如果你不想彻底关闭Google自定义搜索功能,而全部使用WP自带的简易搜索功能,可以在侧边栏中调用WP默认的搜索小工具,为保持该小工具样式与主题风格保持一致,可以把下面的代码加到主题样式文件style.css中,改变其默认样式。
  最终效果如我博客侧边栏的站内搜索。

鉴于近期Google搜索变得极不稳定,HotNews Pro 主题集成的Google自定义搜索功能,也时常失去作用,无法显示搜索结果,如果你不想彻底关闭Google自定义搜索功能,而全部使用WP自带的简易搜索功能,可以在侧边栏中调用WP默认的搜索小工具,为保持该小工具样式与主题风格保持一致,可以把下面的代码加到主题样式文件style.css中,改变其默认样式。文章源自知更鸟-https://zmingcx.com/wordpress-default-search-style.html

  1. /** 搜索小工具 **/  
  2. input#s {   
  3. width:190px;   
  4. height22px;   
  5. *margin10px 0 0 0;   
  6. *+margin10px 0 0 0;   
  7. padding1px;   
  8. border:1px solid #ccc    
  9. }   
  10. input#searchsubmit {   
  11. background:url(images/go.gif) no-repeat;      
  12. width:15px;   
  13. height:15px;   
  14. border:none;   
  15. cursor:pointer;   
  16. text-indent:-10000px;   
  17. }   
  18. .box {   
  19. *height:100%;   
  20. *+height:100%;   
  21. }   
  22. .screen-reader-text {   
  23. displaynone;   
  24. }  

最终效果如我博客侧边栏的站内搜索。文章源自知更鸟-https://zmingcx.com/wordpress-default-search-style.html

注:使用WP默认小工具,一定要添写小工具的标题,否则会造成模板错位。文章源自知更鸟-https://zmingcx.com/wordpress-default-search-style.html

文章源自知更鸟 | 崇尚专注 追求极致 分享交流WordPress经验与技巧,关注前端设计与网站制作,打造自己专属的WordPress主题,让你的博客与众不同!
weinxin
版权声明
本站原创文章转载请注明文章出处及链接,谢谢合作!
全球通用头像Gravatar申请教程 WordPress

全球通用头像Gravatar申请教程

百度百科:我们在很多博客或者网站留言,评论的时候会看到有的人头像很酷很个性化,但是这个博客和网站本身并没有提供设置头像的功能,感觉有点神奇,那么是怎么做到的呢?其实这是使用了Gravatar。 是Gl...
Wordpress面包屑(breadcrumb)导航代码 WordPress

WordPress面包屑(breadcrumb)导航代码

所谓面包屑(breadcrumb)导航,类似这种:首页 > 公司简介 > 发展历史 展示网站树型结构,并让网站访问者随时知道自己所处的位置,方便返回上几级。下面这段代码,可以很容易地将导航...
悲催!HotNews Pro 2.7.2发现严重样式错误 HotNews主题

悲催!HotNews Pro 2.7.2发现严重样式错误

今天在XP下浏览自己的博客,发现字号错乱,大小不一,已严重影响页面布局,第一感觉就是因为XP默认无微软雅黑字体,显示有偏差,但仔细一看并非只是因为字体,而是主题各部分字号定义有问题。 主要是CMS布局...
将百度推荐集成到HotNews主题中 HotNews主题

将百度推荐集成到HotNews主题中

百度推荐于10月未正式向广大站长完全开放,与之相似的同类产品众多,个人感觉百度推荐与其它同类产品不同之处是,完全站内链接,没有跳转,百度推荐的内容都是直接链接到你自己的网站上,而不是像其它同类产品需要...
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定

评论:69   其中:访客  57   博主  11   引用   1
    • 看得见风的人
      看得见风的人 6

      鸟哥,你是怎样实现,例如:让一个视频在它的正文页面显示的所属分类是“欧美音乐”但是又在总的“热门影音”内也显示出来?
      我自己弄的话这个的视频的正文页面就会显示这个视频属于“欧美音乐”和“热门影音”两个分类···

        • 知更鸟
          知更鸟

          @ 看得见风的人 把“欧美音乐”设置父级分类为“热门影音”,再调用这两个分类到导航菜单
          并不是一篇文章选择两个分类
          看了你的问题,才知道为什么经常有人喜欢把一篇文章划到两个分类中了,这些是WP的基本功能

        • 米多
          米多 1

          不想改了,怕弄坏了

          • 看得见风的人
            看得见风的人 6

            鸟哥,为什么侧边栏小工具的那个广告位,放置百度联盟广告不能居中显示呢?

            • 看得见风的人
              看得见风的人 6

              鸟哥,你是如何让“外部引用”只显示标题,而不带链接的?

              • Win7en乐园
                Win7en乐园 8

                呵呵,我直接用的谷歌AD里面的自定义搜索代码,用着蛮好的。让搜索的结果在外部打开

                • Win7en乐园
                  Win7en乐园 8

                  不过我有个问题呀,希望鸟哥帮忙解决,就是导航栏上面的搜索,当打开主页的时候,你使用上面的搜索东西,会显示没有结果,而在内页使用的时候,搜索正常,不知道该如何解决,求教鸟哥。

                    • 知更鸟
                      知更鸟

                      @ Win7en乐园 你使用的版本首页是谷歌自定义搜索

                        • Win7en乐园
                          Win7en乐园 8

                          @ 知更鸟 哦,这样呀、那有没有快速的将它改成WP自带的呢?(弱弱的问下,用免费的主题,我已经感觉到很不好意思了~~~~还问问题。。)

                      • Win7en乐园
                        Win7en乐园 8

                        另外,今天的PR清空了,以后没有PR值了呀!!呵呵

                        • 瑶浴药包
                          瑶浴药包 0

                          呵呵 哎呀哎呀

                          • gaogang
                            gaogang 2

                            我也不改了,我的文章太少,用不上站内搜索。

                            • 牛初乳
                              牛初乳 1

                              我的文章不多,,谢谢博主分享。

                              • 面包机
                                面包机 1

                                这个还不错。。经常关注博客的可以搜索。

                                • 宝宝
                                  宝宝 5

                                  我的首页头部标签还是不能靠右,标签不少了,但是不会显示在头上!哎!

                                  • 汕头SEO
                                    汕头SEO 5

                                    这个很好!

                                    • wmtimes
                                      wmtimes 7

                                      楼层都给盖住了。

                                      • 空中白鹤
                                        空中白鹤 2

                                        不太想改 我不懂代码啊

                                        • 四川人
                                          四川人 6

                                          奇怪,为啥我的就不行呢!显示样子不是你这样的

                                          • 四川人
                                            四川人 6

                                            对了,你上面的代码应该是input,少了一个i,我找了半天

                                            • 四川人
                                              四川人 6

                                              还少了几个东西 完整代码如下: /** 搜索小工具 **/

                                              • 四川人
                                                四川人 6

                                                对了博主问下,我的网站每个人的头像怎么都不显示了?gravatar服务器是不是在我网站就不显示了

                                                  • 知更鸟
                                                    知更鸟

                                                    @ 四川人 这个问题很早就写过了
                                                    而且主题说明中已注明方法
                                                    http://zmingcx.com/loaded-directly-from-the-main-station-www-gravatar-com-avatar-gravatar.html

                                                  • 调皮鬼
                                                    调皮鬼 3

                                                    G最近或将有动作,其实不只是搜索功能受到了一定程度的影响,幸亏鸟兄将问题解决了,辛苦了!

                                                    • Bob
                                                      Bob 5

                                                      感谢鸟哥啊,正需要这个呢!

                                                      • 我震惊了
                                                        我震惊了 1

                                                        鸟哥,你真是太强大了,支持

                                                        • Love下载
                                                          Love下载 2

                                                          我的搜索样式还是没有改变,都是按照你说的修改的,小工具标题也写了,css文件也添加了

                                                          • Love下载
                                                            Love下载 2

                                                            知道什么问题了,是浏览器的问题,我用火狐浏览器没问题。用360极速浏览器中的兼容和IE9就会没改变,希望能在修改一下支持所有浏览器

                                                            • 银川摄影工作室
                                                              银川摄影工作室 3

                                                              学习了

                                                              • whxcr
                                                                whxcr 1

                                                                这里人好多 来学习一下

                                                                • 我的移动互联
                                                                  我的移动互联 2

                                                                  鸟哥,真心是服务到细致哈~

                                                                  • 冰菁翎羽
                                                                    冰菁翎羽 4

                                                                    用了这段css加入之后,侧栏有错位。你看看你的右栏读者墙就错位了!

                                                                    • 北京摄影
                                                                      北京摄影 2

                                                                      来取经的,嘿嘿

                                                                      • 银川婚纱摄影
                                                                        银川婚纱摄影 3

                                                                        不错这东西蛮好的

                                                                        • sealango
                                                                          sealango 5

                                                                          突然发现一个问题。
                                                                          之前就一直奇怪鸟哥在2.6右上角搜索,用的是谷歌搜索,为什么到了2.7中改成了主题自带的。
                                                                          今天才发现你这里还是用的谷歌搜索。于是去翻查了2.7和我博客上的代码。发现都是写的判断谷歌搜索是否启用的东西。
                                                                          但就是这样,我的博客右上角还是用的主题自带的搜索结果。这是为什么?是不是哪里没有开启了。
                                                                          这搜索的代码,一直没有动过。

                                                                            • 知更鸟
                                                                              知更鸟

                                                                              @ sealango 如果你看全了主题说明,就不会问这个问题了

                                                                                • sealango
                                                                                  sealango 5

                                                                                  @ 知更鸟 ■ Google自定义搜索

                                                                                  可以在主题设置中开启Google自定义搜索,然后添加一个页面,右下页面属性“模板”中选择“谷歌搜索”模板,最终搜索结果将显示在这个页面中,只需在主题设置中输入搜索结果链接页面及自已的搜索ID即可,默认是我的。附:Google自定义搜索操作方法

                                                                                  如果指的是这个的话,在2.4中,确实都如法泡制,直到2.6中也没做任何修改。都可以正常搞用谷歌搜索。到了2.7中就不出来了。

                                                                                  • sealango
                                                                                    sealango 5

                                                                                    @ 知更鸟 找到问题所在了,确实是2.7中的一个更新细节。
                                                                                    你把他做到了主题设置中,并单独开辟了一个搜索设置的区块,给其他人自己选择搜索结果页的形式。
                                                                                    我自认为已经很用心地研究你的主题了,都没发觉到这个变化,更不指望多数人都能发现这个升级细节啊。2.7说明的一句话也没讲清楚这一块啊。

                                                                                      • 知更鸟
                                                                                        知更鸟

                                                                                        @ sealango 主题设置中单独分出一块设置这个,没看见?还是不够用心,呵呵

                                                                                  • Coach Outlet
                                                                                    Coach Outlet 2

                                                                                    鸟哥厉害啊

                                                                                    • ugg outlet
                                                                                      ugg outlet 1

                                                                                      主题设置中单独分出一块设置这个,没看见?还是不够用心,呵呵

                                                                                      • 小虾米
                                                                                        小虾米 0

                                                                                        鸟哥哥,你那欧美音乐那里面那些歌和那些图片排序是怎么整上去的,模板里面为什么没有啊,里面只有6个模板没有音乐啊

                                                                                        • cheap burberry
                                                                                          cheap burberry 1

                                                                                          鸟哥哥,你那欧美音乐那里面那些歌和那些图片排序是怎么整上去的,模板里面为什么没有啊,里面只有6个模板没有音乐啊

                                                                                          • louis vuitton outlet
                                                                                            louis vuitton outlet 1

                                                                                            提示:为了防止垃圾留言,您的留言中必须输入一些中文!

                                                                                            • ugg outlet
                                                                                              ugg outlet 0

                                                                                              Ugg Knit Cardy ugg outlet store, you can use spot colors that will make your brands more identifiable.2. Other than this Burberry Crossbody Bag Uggs Outlet 很好

                                                                                              • eyeyue.com
                                                                                                eyeyue.com 0

                                                                                                防止垃圾留言,您的留言中必须输入一些中文!

                                                                                                • yumanutong
                                                                                                  yumanutong 6

                                                                                                  加了,没用,汗

                                                                                                  • obert
                                                                                                    obert 0

                                                                                                    Robin 大哥,您好!
                                                                                                    我在使用您的2.7plus主题,现在有一个地方有点儿小问题,请您协助看一下。网站现在主页面,分类页面打开、显示都正常。但是在点击:阅读全文 看里面详细内容的时候,右侧就出现错位,底部菜单也跑到了右侧,不知是何原因。请问您是不是我有什么地方设置或者修改有问题?
                                                                                                    盼复,谢谢您!
                                                                                                    obert msn&email:obert_777@live.cn

                                                                                                    • 大师兄
                                                                                                      大师兄 0

                                                                                                      很多问题需要解决

                                                                                                      • 583598992
                                                                                                        583598992 0

                                                                                                        请问一下 网站的站内搜索框是这么弄的啊 能给一下代码 参考一下吗