Hiding Navbar from .blogspot Blog
Exclusive Blogger Blog Tips
Look at the second image given below. You the Blogger Blog Users know that it's an image of Navbar. We found the Navbar at the top of a Blogger Blog. But in some of the blogs there are no any Navbar. Those blogs are customized to hide navbar, so that they look like a standard website. There is also no any Navbar in this blog. Lets follow the steps given bellow to hide the Navbar from your Blogger Blog Site. There are two ways of hiding a Navbar and I have given here both of them.
The primary way of Hiding Navbar
Step 01 Log in to Your Blogger Blog Account
At first you need to log in to your blogger account, as you need to work as the Admin of the blog. After logging in, click on Layout from the left side menu bar and wait a while.
Step 02 Find Out the Navbar Gadget
After loading, find out the Navbar Gadget from the uppermost right corner of the Layout Window. Now click on Edit of the Gadget as shown in the image given below.
Step 03 Check the Radio Button Off
After clicking on Edit a pop-up window called Navbar Configuration, will open like the image given bellow. Now check the Radio Button named Off. Look at the image, I have kept the mouse pointer where you have to click to check the Radio Button.
Step 04 Save Your Settings Clicking on Save Button
Now click on Save Button to save the settings and then check your blog to see if there is still the Navbar or not.
Hide the Navbar Using Codes
You may also hide the Navbar using some Codes. The needed code are given below, you just need to paste them in right place. If you want to hide the navbar with coding then you have to access the HTML Codes of the template. However, follow the steps given bellow to hide the navbar by coding.
Step 01 Log in to Your Blogger Account
First of all you have to log in to your Blogger Account as you need to access the HTML Codes of the Template.
Step 02 Access the Codes clicking on Edit HTML
Now click on Template from the left side menu. Then click on Edit HTML from the Template page and wait for a while. Soon the codes will appear before you.
Step 03 Find ]]></b:skin> Pressing Ctrl+F
Now click anywhere of the codes and press Ctrl+F from the Keyboard. Look a Search Box has opened at the right side upper corner of the browser if you use Google Chrome Browser. Now type ]]></b:skin> into the Search Box and press Enter from your Keyboard to find out them.
Step 04 Copy the Codes Below and Paste them after ]]></b:skin>
Now copy the codes given bellow in the box and paste them after ]]></b:skin>.
<b:if cond='data:blog.url == "http://www.iDhali.com/"'>
<style>
#Navbar1{
display: none;
}
</style>
</b:if>
<b:if cond='data:blog.url != "http://www.iDhali.com/"'>
<style>
#Navbar1{
display: none;
}
</style>
</b:if>
|
|---|
But you have to replace the URL http://www.iDhali.com/ with your blog's URL. Otherwise the codes won't work for your Blog.
Step 05 Save Your Work and Check the Blog
Now click on Save Template button from the lowermost right corner of the Edit HTML window. Then check your blog again. Hope the Navbar is not anymore in your blog.
No comments:
Post a Comment