3 Different Ways To Hide or Remove Blogger Navbar

In my previous tutorial, I showed you how to fix why blogger posts were not showing in blogger homepage, today I will show you how to remove or hide blogger navbar. I know you are in hurry to remove blogger navbar but before you proceed towards the tutorial, I recommend you to understand about blogger navbar its advantages and disadvantages.

What is Navbar In Blogger?

Navbar stands for Navigation Bar in Blogger. Navbar is present at the top of every blogger blog it helps visitors to navigate the blog easily. By default, Navbar is present in all blogger blogs but in most custom coded blogger template navbar is hidden. Now in any blogger blog navbar can be shown or hide anytime. But, if you want to hide or remove blogger navbar in blogger default template you can do that manually by editing some HTML/CSS codes. Since google blogger by default provides this widget in blogger it must have some advantage and disadvantages.

Advantages of Navbar In Blogger

1. In the default blogger template, at the top of the blogger blog Navbar contains a search box, which visitors can use for searching any article in the blog.
2. Next, to the right of the search box, a G+1 share option is there, which visitors can use to share articles in google plus.
3. Just next to the right of share, more option is there with a drop-down cap, which visitors can use to share your article through "Share by Email", "Share with Facebook", "Share with Twitter" and "Report" option which your visitors can use to report any article which violates google privacy policy.

Disadvantages of using Navbar In Blogger

1. In the top right of blogger navbar next to "Share" option "Next Blog", "Create a Blog" and "Sign In" options were there which distracts visitors and increases bounce rate by leaving visitor from your blog to another blog.
2. It captures some space above the blog.
3. It just captures some space and makes your blog look unprofessional.

By Default Blogger navbar is not necessary for any major purpose related to blogging. So it is better to remove the navbar from the blogger blog. Now you have enough knowledge relating navbar its advantages and disadvantages.

Now it's your choice you want to keep or remove navbar. If you are determined to hide or remove blogger navbar then next part of this tutorial meant for you.

How To Remove Blogger Navbar?

To remove navbar in blogger is very simple. Any newbie with no coding knowledge can remove navbar in blogger following this tutorial. In this tutorial, I will show you 3 Different Ways To Hide or Remove Blogger Navbar.

• How to remove powered by attribution blogger?
• How to remove Quick edit and wrench icon in blogger.

Method 1

In this method, you can hide or remove blogger navbar using "Layout". Follow these steps to remove or hide blogger navbar.

1. Login to your "Blogger Account" and select your "blog" on which you want to hide or remove navbar.
2. Go to "Layout".
3. Click "Navbar" in the Layout.
4. A Pop-up window will open select "OFF".
5. Click "SAVE".

Also, you can hide or remove blogger navbar selecting "Transparent Light".

After selecting "Transparent Light" click "Save" and refresh your blog your blogger navbar will be removed.

Method 2 (Removing Navbar Space)

In this method, you can hide or remove blogger navbar by adding some CSS codes in your blogger template. Follow the step to remove or hide blogger navbar.

1. Log in to blogger account and select your blog.
2. Goto Theme > Edit HTML.
3. Press CTRL + F anywhere inside code area, a popup box will appear in the top right corner.
4. Paste ]]></b:skin> and press enter.
5. Now, above ]]></b:skin> paste the below given code

# Navbar-iframe {
height: 0;
width: 0;
visibility: hidden;
display: none;
}

Click "SAVE" and you are done.

Method 3

In this method, you have to remove the complete navbar code from your blogger template. Follow the step to remove navbar from your blogger template.

1. Log in to your blogger account and select your blog.
2. Go to Theme > Edit HTML.
3. Press CTRL + F anywhere inside code area, a popup box will appear in the top right corner.
4. Paste "Navbar" and search the section class='navbar'.
5. After getting the code remove the complete code from <b:section........</b:section>
6. Click "Save" and you are done.

Lastly

Choose any one method from the above-mentioned 3 different ways to remove or hide navbar blogger navbar. I have explained each and every step so that you don’t get any problem. To go through the steps as I mentioned in this tutorial will not take more than a minute. If you have any further query relating implementation of code or removing navbar from your blogger template code area. Leave a comment, we are ready to help you with removing blogger navbar. Comment down let me know which method you used to remove or hide blogger navbar and navbar space.