Home About Stuff Friends

Tutorial Navigation Like a Mine

Hai fina balik lagi lama gk ngepost ya.. he..he...he.. nih aku kasih tutorial ini first tutorial simak yuk..special credit dari Kak Kinantinavigasi ini cocok untuk blog yang gak ada headernya.tapi kalo ada juga bisa kok...Read more aja yakk X )


1.copas kode di bawah ini di tata letak>add a gadget>HTML & JavaScript

<style>
.btd a{
display:inline-block;
width:130px;
text-align:center;
text-transform:none;
font:
12px georgia;
text-transform:lowercase;
text-decoration:none;
font-style:italic;
color:#111;
opacity:0.9;
margin:2px;
padding:5px;
letter-spacing:2px;
text-shadow:4px 0px transparent, -4px -0px transparent;
-webkit-transition-duration:0.5s;
-moz-transition-duration:0.5s;
-ms-transition-duration:0.5s;
-o-transition-duration:0.5s;
transition-duration:0.5s;
}
.btd a:hover {
text-shadow:0px 0px #000, -0px 0px #000;
}
.howon {
position:fixed;
left:0px;
top:0px;
width:100%;
background:url(
http://i.imgur.com/liHPRB9.jpg);
padding:20px 10px 20px 80px;
border-bottom:6px solid #fff;
margin-bottom:10px;
box-shadow:1px 1px 1px #aaa;
z-index:999;
}
.satu {
margin-left:
120px;
margin-top:
48px;
background:white;
width:
760px;
opacity:0.85;
border-radius:0px 15px 15px 0px;
}
</style>
<div class="howon">
<img src="
http://i.imgur.com/jOtEyMH.jpg" style="width:110px; float:left; border:8px solid #fff; border-radius:100px; z-index:999;" />
<div class="satu"><div class="btd">
<a href="LINK HERE">Title1</a>
<a href="LINK HERE">Title2</a>
<a href="LINK HERE">Title3</a>
<a href="LINK HERE">Title4</a>
<a href="LINK HERE">Title5</a>
</div></div></div>

Note:
Blue    : background navigation
Red     : image yang bulat
Ubah kode lainnya sesuai keinginan yang sudah di bold

2. Save. Kemudian pergi ke Template > Edit HTML . Cari kode ini (CTRL F) : .content-outer {
Paste kode di bawah ini di bawah code yang kamu cari tadi :  margin-top:110px;
 
3. Save atau perview dulu dan semoga berhasil

 semoga suka tutorialnya ya..