At the top of Blogger Blogs you will a navigation bar known as Navbar.It
enables your readers to sign in to their blogger account,search for
blogs, go to next blog, customize, etc...But many of us wants to remove
Navbar to give a professional look to our blog.In this post I am going
show you 4 simple tricks to remove or auto-hide the Navbar.
Now lets go to the tutorials.
Four Tricks To Remove Blogger Navbar
Now lets go to the tutorials.
- Go to Blogger Dashboard > Design > Edit HTML.
- Backup/Download your template.
1. Hide Blogger Navbar
- In your template search for ]]></b:skin>
- Add below code just above it.
#navbar-iframe { height:0px; visibility:hidden; display:none; }
Preview your template, you will find out that the Navbar is not visible (hidden), and then save your template.
2. Auto Hide Navbar (i.e visible on hover)
Add below code just above ]]></b:skin> if you want to visible the navbar on mouse hover.
#navbar-iframe{ opacity:0.0; filter:alpha(Opacity=0); } #navbar-iframe:hover{ opacity:1.0; filter:alpha(Opacity=100) }
3. Remove Blogger Navbar Completely
Add below code just above </head> tag in your template.
<!-- <body> <div></div> -->
This will not only completely remove the blogger navbar but you may also find that the quick edit pencil and wrench icons are also removed. This can be a big help for those people who are trying to validate their blogger templates.
4. Remove Navbar from New Designer Templates from Blogger
For the new template designer, follow any one of the tutorials above but use "navbar" instead of "navbar-iframe". So the example of whole code is:
#navbar { height:0px; visibility:hidden; display:none; }
0 comments:
Post a Comment