Blogger Tips: How to remove or hide the blogger navigation bar?


In blogger you get this default navigation bar, which you can hide if you want. There is no real advantage or disadvantage for keeping or removing it. It's just that if you want to keep a clean look, you can do that.

A) Steps to remove the Blogger navigation bar using CSS code:


  • Go to BLOGGER DASHBOARD > TEMPLATE
  • Click CUSTOMIZE
  • ADVANCED > ADD CSS
  • Paste this code in the space provided
    #navbar-iframe {
    display: none !important;
    }


    or
    another code that works is:

    #navbar {
    height: 0px;
    visibility: hidden;
    display: none;
    }


    • Click APPLY TO BLOG > BACK to BLOGGER

    B) Another way without CSS code:

    You can also remove or hide the default Blogger navigation bar from Blogger > Layout. But it is possible only if the navigation bar widget is not locked.

    How to find out if Blogger navigation bar widget is locked or not?

    • Login to Blogger > Your Blog > Settings > Layout
    • Find a widget with name "Navbar".
    • If the "Navbar" widget is locked that is, it is not movable and greyed out.

    How to unlock Blogger widgets?

    • If the Blogger widget is locked, it is not movable and slightly greyed out at the corner. It does not have the drag-able handle.
    • Unlock the widget from TEMPLATE > EDIT HTML
    • Click on "JUMP TO WIDGET" > "NAVBAR1"
    OR
    • Click anywhere inside the template page and press CTRL+F and search for "Navbar"
    • Change the value of "locked" from "true" to "false"
    Before : <b:widget id='Navbar1' locked='false' title='Navbar' type='Navbar' visible='true'>
    After: <b:widget id='Navbar1' locked='true' title='Navbar' type='Navbar' visible='true'>
    • Save Template
    • Go back to LAYOUT 
    • The widget is now unlocked an drag-able
     You have unlocked the Blogger widget which was locked and not movable.

    How to delete or remove a Blogger widget (such as navigation bar, attribution etc)?

     
    To remove or delete or turn off a locked Blogger widget such as navigation, attribution (powered by Blogger) etc., do the above steps to unlock the widget first. Then from LAYOUT page, click EDIT and then REMOVE.
    • Go to BLOGGER > LAYOUT
    • Click on the "edit" link in the "Navbar" widget (top right corner)
    • Check "off" > save
    • Click "Save Arrangement"

      For Blogger Attribution widget, you will get an option to REMOVE the widget. You can do so, to remove the widget.

      That's it.
      Now you should have a blogger page without the navigation at the top.

      See here: How to remove the "Powered by Blogger" attribution widget from Blogger?

        No comments