Tutorial: Made your own Navbar / Buat Navbar sendiri

Assalamualaikum

First of all, what is Navbar? o.O Let me introduce you to..

//Click to view it better

NAVIGATION BAR! ^^ 

But, that original Blogger navbar is tooo old-fashioned. It not suited our taste nowadays, isn't it? =p So.. How to made our own navbar? =D

Okay, simpy follow these steps below.

1. Blogger --> Template --> Edit HTML

2. Copy these code below.


<div style='position:absolute; overflow-x:hidden; overflow-y:hidden; padding:2px; left:0px; top:0px; width:99.7%; background: #ffffff; background-image:url(PICTUREURL); opacity:1; color:#1c1c1c; font-size:11px; text-align:center;'> Welcome to my blog! <a href="http://www.blogger.com/home">Dashboard</a> | <a href="http://www.blogger.com/follow-blog.g?blogID=YOURBLOGID">Follow</a></div>

3 Paste the code BELOW </head> (CTRL + F to search! =) )

4. Edit:

PICTUREURL - The Navbar's background's URL.  =P

#1c1c1c - The font's color code. Choose it HERE. Or! You can type the color. Example, color:black;

11 - The font's size.

Welcome to my blog! - Change with your word. =)

YOURBLOGID - Your Blog ID! =p *Don't know what?

absolute - If you want the navbar scrolling with you, (example here) change it to fixed. =)

5. Preview. Is it okay? No need to change? No errors? Save! =D

p/s: Make sure you off the original navbar first! ;) Don't know how?

Credit to: Kak Nurrul & Kak Kiera