Tuesday, February 28, 2012

How to remove Blogger Navbar {Blogger Tip Tueday!}

Tuesday, February 28, 2012
Welcome to Blogger Tip Tuesday!
Last Tuesday of Every Month
@ Mrs. B's Hive
February, 2012

Although this blog is new, I have been blogging since before the term "blog" was created.  I am from old school blogland, before Blogger or Wordpress existed and I had to code everything manually and use an FTP to get it online and I walked to school uphill, in the snow, barefoot... both ways!  When Blogger did come around, I scoured the internet for help to customize my blog template without paying for it. 

I am no professional, but I thought some of my readers might be into to this, as we are all looking for ways to DIY to save some money.  Why spend money when you can do it yourself so easily?  We have this mindset when it comes to our home -- why not our blog homes?  After all, our blog is sort of like our second home, right?  :)

With that being said, some people may not want to deal with it and want to hire someone to design a gorgeous blog, and that is completely wonderful too, because we are all about supporting small business, right?!

So for those of you who want to follow along, read ahead.  And those of you who have no interest, check out my blogroll page and pay a visit to some awesome ladies.

Ready?
So for our first installment, I thought we could do something basic, like removing the blogger Navbar. 

Do you have one of these Navbars at the top of your Blogger powered blog?


Some folks choose to keep this Navbar at the top of their blog, and that is fine and dandy.  Others, like myself, prefer to remove it to make the page look more streamlined and customized.

It is SUPER-DEE-DUPER easy to remove, or "hide" it as we will do in this case.


1.  Log into your Blogger account.  Choose the blog you wish to edit.

2.  Click on Template >> Customize



3.  In the Blogger Template Designer click Advanced >> Scroll down and click Add CSS



4.  Copy the following code and paste it into the "Add custom CSS" field:

#navbar-iframe {  
 display: none !important;
}

5. Click Apply to Blog.  Done!



FAQ about removing Navbar:

WHY SHOULD I KEEP IT?
It really is a personal preference.  Some people like to keep it because it allows them quicker access to their Blogger Dashboard.  Others like it because they can navigate to the "Next Blog".  Some claim it is easier for readers to follow their blog.

WHY SHOULD I HIDE IT?
Again, it is about personal preference.  I like to hide it because I want my blog to look customized and professional, and I find the Navbar hinders that.  Some claim that an erroneous or fraudulant "Report Abuse" claim could cause problems for the blog owner (I don't know much about how that works).

WHAT ABOUT HIDING VS. REMOVING?
The method I showed you uses CSS to hide the Navbar, which in my opinion, is the quickest and easiest (and best!) way to do it.  There are ways to completely remove the code, but it is not necessary.

I HAVE SEEN OTHER TUTORIALS ADD THE CODE SNIPPET TO THE HTML SECTION, WHY DON'T YOU?
There are several ways to hide the Navbar.  Using the Add CSS path through the Blogger Template Designer is the easiest and cleanest way. 
More advanced users can choose to Edit HTML, Expand Widgets and paste the code snippet just before the ]]></b:skin> line.  It does the same thing, one is a longer path than the other.

WHAT IF I HIDE THE NAVBAR, BUT DECIDE I WANT IT BACK?
Go to Template >> Customize >>  Advanced >> Add CSS - delete the code from the Add Custom CSS field >> Apply to Blog.

IF I REMOVE THE NAVBAR, WILL OTHERS BE ABLE TO GET TO MY BLOG BY CLICKING "NEXT BLOG"?
Yes.

Next Blogger Tip Tuesday is scheduled for March 27th, 2012.  

Do you want to know how to do something in Blogger? Submit your questions to: mrsbshivetheblog [at] gmail [dot] com. 

0 comments:

Please leave a comment...

I love reading your comments! I read each and every one of them. Thank you!

Related Posts Plugin for WordPress, Blogger...
© 2012 Emily B. | Mrs. B's Hive.
All rights reserved.