Blogger Venue

How to Hide the Blogger Nav Bar

To make your blog site / website look like a real website, you don’t only need to choose a professional looking layout but also to customize the parts to make it look like a real website. Bloggers, especially the experts remove the Blogger Nav Bar to make their sites look better.

What is Nav Bar?

The Nav Bar is the toolbar that appears on the top of your blog that looks like the image above.

Even if you’ve change your blog layout, it sometimes stays, making your layout to look different. But don’t worry because it’s easy to hide it and it’s legal in Google.

Follow these steps:

1. Go to Dashboard --> Layout --> Edit HTML and click “Download Full Template to save your template in case you’ve done a mistake.

2. Find the “body” tags in your template HTML code. Go to Dashboard --> Layout --> Edit HTML and find “ body” tag. It usually appears on the beginning of the HTML code. It is appears like the code below.

/* Use this with templates/template-twocol.html */

body {

background: ... ;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;

}

Hard to find it? Press CTRL F and type body on the textbox that appears on the bottom of the window. You’ll then see it.

3. Once you find the code above, add the tags below AFTER the “text-align: center;”

position: relative;
top: -30px;

The result should look something like this:

/* Use this with templates/template-twocol.html */

body {

background: ... ;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
position: relative;
top: -30px;

}

4. Preview your blog now to see if the trick works. If it’s ok, save your new template.

Have some difficulties in doing the trick? Leave your questions below and I’ll surely reply to help.

This post is written by: Fehl

Fehl is a web content publisher, published poet, photographer, and businesswoman. Follow her on Twitter