Blogger V3.0:隐藏NavBar,添加站内搜索

对于有些模板来说,NavBar跟整个模板看起来打配的并不合谐,因此我们会去掉NavBar。如果站内内容比较多,为了方便读者查找站内信息,添加一个搜索框是非常必要的。这一篇文章将介绍如果去掉NavBar并添加站内搜索框。

一、去掉NavBar
非常简单,只要在CSS中添加以下CSS即可
#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}
二、添加站内搜索
创建一个Elements---->>Html/JavaScript,添加以下代码


其中的Maxlength用来确定搜索框内输入字符的最大数和Size控制搜索框的长度。

另外可以修改“Search”按钮的样子,默认的是






最常见的按钮:







或者这种:





14 条评论:

Zhang 说...

去掉NavBar的方法太差了,可以直接在后台设置或者修改模版弄掉的

GoOGoZ 说...

你那个去掉navbar的方法我早就用过了,不过我是引用外部CSS,好像不起作用。

咖啡鱼 说...

这个Blog就是用这种方法去掉的NavBar。添加这几句CSS不是最好的,却是最简单的方法。

GoOGoZ 说...

行了,我那边也好了。

gosman 说...

这方法太好了,我那边也好了。

任平生 说...

汗,大家都做成功了阿,

我怎么不知道应该把这句加在那里呢?

匿名 说...

谢谢你.我的NavBar也去掉了.

添加"Search"按钮也成功了,但似乎中文内容搜索功能有点问题?

JPenG 说...

你好,你的方法之前我可以使用!
可是現在我更新到了BETA版,添加了你給的代碼就不能去掉NavBar了。
能不能再給給辦法啊?
Thanks

JPenG 说...

謝謝,我已經解決了!

柚祐 说...

TO: JPenG

新版的Blogger可以用阿!
我就是用這個語法去掉的喔 ^^

bwcfront 说...

好像不行吧,那个条其实很有意思,可以发现很多有趣的日志

Eric White 说...

我用google ad提供的站内搜索,功能挺好用的。

fenglu 说...

请问如何做到和这两个网站一样自动隐藏导航栏(而非永久),鼠标悬停会出现,并且不留下空白呢?
参见:
http://knowwei.blogspot.com/
http://realgouki.blogspot.com/

malaysia888 说...

谢谢,我的搜索功能做好了。有空欢迎来踩场!
http://www.Malaysia888.com