]]>
skip to main | skip to sidebar | skip to search | skip to extra navigation
I'll be blogging more frequently at Dani Iswara .Net.

Saturday, March 17, 2007

Valid, Hide or Remove Blogger NavBar

Should you hide or remove Blogger navigation bar?
What is your reason?
Is it legal?
Is it controversial?
What tricks are available?
Is it OK on Firefox and IE?
Is it valid on CSS and XHTML?

I found some usual reason for this:
• the navbar doesn't match on the design
• the color options is limited
• it just look pretty without it
• I don't know the navbar function
• it doesn't valid CSS and XHTML
• etc

Based on Blogger and BlogSpot Terms of Services, there is no warning explicitly. I never heard a ban for this case before.

It has an ethical issue that Blogger give us a free services and we should give a credit for this one. In my opinion (CMIIW), without the navbar, we can put Blogger logo or Blogger link on the sidebar also.

There ada some tricks to remove/hide navbar:
- sign in on Blogger.com
- go to the template section

• just remove/hide navbar by editing template (X/HTML), work on Firefox and IE, but it does not valid CSS and XHTML

find this code on your template:
<body>

change with the code below:
<noscript><body></noscript>

or this code:
<noembed><body></noembed>


• to remove/hide navbar by editing Cascading Style Sheets (CSS), work on Firefox and IE, could be valid CSS and XHTML

find this code on your template (or your external CSS):
<style type="text/css">

...

</style>

for old Blogger account, put this CSS code between your style code:
#b-navbar {
height:0px;
visibility:hidden;
display:none;
}

for new Blogger account, put this CSS code between your style code (with additional information):
#navbar-iframe /* Indicating to the Navbar ID */
{
height: 0px; /* Reducing the height of the Navbar to 0px */
visibility: hidden; /* Reducing the visibility to hidden */
display: none; /* Remove the display option(indirectly hiding it */
}

if it doesn't remove/hide the navbar yet, add CSS code below
in the body section:
body {
margin-top:0px;
}

or try this CSS code:
body {
margin-top:0px;
position: relative;
top: -50px;
}

or just try this method:
#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}


Just remove the code to show it again..

The navbar might be useful for other users..

It is your choice..

Thank You, creative people.. :D

For the blogspot validation, please check BlogSpot XHTML Validation
Dani Weblog Template Walkthrough 1.

Labels: , , ,

[+] Bookmark Valid, Hide or Remove Blogger NavBar
Cite Valid, Hide or Remove Blogger NavBar!

posted by Dani Iswara at 12:46 PM . | | Print