115. Hiding The Blogger Navigation bar
How do I remove the Blogger navigation bar?
If you really want your blog to look like a website, you’ll want to hide the Blogger navigation bar at the top of the page. There are many reasons you’ll want to hide it and Bob is going to show you how to do it in this video.
Click Here to get the code you’ll need for this video
Learn:
- How to hide the Blogger navigation bar at the top of your blog
- How the Blogger navigation bar works
- Where to place the code in your template to hide your Blogger navigation bar


WOW it works ^_^ thanks a ton!
Hey, can anyone provide me with a copy of the magic Code to be insert into the Template? I’ve tried following the link to download that code, but it leads me to somewhere that says I can’t access XML code or something like that.
Any help please?
[...] don’t understand is the amazing customization you can do with Blogger. For example, you can remove the Blogger Nav Bar from your header easily. You can easily accept credit cards on your Blogger blog and much more. [...]
If the navigational bar is hidden how do we sign in and work on the blog at a later date?
To log in at a later date you need to go to http://www.blogger.com and log in. Once you are authenticated you will be taken directly to your dashboard.
The code it shows for the download didn’t work for me and it doesn’t look like what’s on the video. What am I missing? Help…. did I download the wrong code?
You need to add the following code to the CSS section of your Blogger template.
#navbar-iframe {
display: none;
}
That should remove the navBar
thank you for the code. i got it now. it really help.
I put the code in the right place. The navBar removed, but lots html code show on my blog. I don’t know why. I need help.
First, THANK YOU for this series! Thanks to your videos, an idiot like me made a good looking blogger website for a friend’s business! I didn’t think it could be done (certainly not by me, anyway.)
Second, I am trying to remove the navbar and following your directions, it also removes the little pencils! Without the little pencils, I cannot edit anything! Is there a way to take out navbar without losing one’s pencils? (Let alone one’s marbles?).
You are EXTREMELY likable indeed to provide such a fantastic free resource on the web! Thanks again!
whats the code to hide nav bars on youtube videos??
can anyone help??
Hey, can anyone provide me with a copy of the magic Code to be insert into the Template? I’ve tried following the link to download. What do I do when there is no CSS and in the vidio said some thing to templates.template and in my html I can not find the css I and the link code dose not have the end on it. I tryed to put it between the and and befor the and said I was going to lose my wigets, then i viewed my blog and my whole site look like a html I thought I had lost every thing but I fix it. But I would like to hide my Blogger Navigation bar. so if some one could help me!
Any one can you help?
Thank Julie
In the all the tranning viedo on making you blog looking like a web page has been really good. Very thing has worked really good tell I got to the hide the Blogger navigation bar the html code dose not work.
Can someone help with the right html for the navigation bar. thank you
Julie.
Unfortunately, neither the code provided for this video, no the code posted by Josh here, in comments, doesn’t work for my template. I have a standard Blogger template — nothing fancy. And I did copied the code into the CSS section.
Any help would be appreciated. Thank you.
Try adding the following code to the CSS portion of your current template.
#b-navbar {
height: 0px;
visibility: hidden;
display: none;
}
#navbar-iframe {
height: 0px;
visibility: hidden;
display: none;
}
I’m having the same problem with all the html code getting on my site when I tried to remove the nav bar. The nav bar was gone, but all that other text no good. Tried the original code from the video and then the additional code with it but no luck.
Can you help?? I’m not sure what I’m doing wrong…
Thanks!
thanks. after some unsuccessful attempts i tried josh sommers’ and it works. thanks guys for the tips and post some more blogger tips. more power
Try this: It works
/* KILLING THE NAVBAR */
body #header {margin-top:0;}
#navbar-iframe {display:none;}
To make the above work in Chrome add !important to margin-top:0
Thank you for the fix!
Thank you