Friday, December 7, 2012 @ 3:06 AM
0 stares
Hi peeps! :D
Good news! Because some people asked me how to make a navigation like me. Uh,oh,what the navigation type? Look at this picture below!
Nah,are you interested with this navigation type? If yes...follow this tutorial!
Step one,you must open your blog. CTRL + F and paste this code below #navbar-iframe { codes.
.navi { position: absolute; top:0px; right: 4px; left: 230px; width:380px; height:25px; border-radius:5px; position:relative; padding:5px; background: url(URL BACKGROUND); color:#ffffff; font-size:11px; font-family: your favorite font; font-size: your font size;}
Fuchsia: change with your own width. Make sure that its size is not too big! :D
Height: change with your own height.
Blue: change with your own radius.
Red: Paste your background URL
Orange: change with your own font.
Green: change with your favourite font. You can use Google Webfonts if you bored with the font that you use it as usual. |
Oh yeah! If you want the navigation is non color for example like white background or whatever you want,you can change the background: url(URL BACKGROUND); code to background: #fff; The bold words can changed by the color codes you want. Twala!
Step three,CTRL + F and search </style> code. Paste this code,below the </style> code. (if you have the header codes,paste it under the HEADER CODES.)
<div class= "navi"><center><a href='URL'>SENTENCE TO NAVIGATION</a> <a href="URL">SENTENCE TO NAVIGATION</a>
<a href='URL' target='_blank'>SENTENCE TO NAVIGATION</a><a href="URL">SENTENCE TO NAVIGATION</a></center></div>
Green: change with the url.
Red: Sentence of the navigation. Ex: affiliates,follow,about me,etc.
If you want to add the navigation options juga type / copy the <a href='URL'>SENTENCE TO NAVIGATION</a>,so also when you want to add more navigation options.
Preview and save!!! Just ask me if you have any problem of this tutorial.
Have fun and happy trying!