Navigation part 1
Sunday, September 30, 2012 // 0 comments
Annyeong~
Lihat navigation di blog ini nggak? Itu tuh, yang ada tulisan freebies, tutorials, entries, about. Nah.. itu yang aku maksud. Tertarik? \(^w^)/ Nggak? (~T^T~) Ok, ayo simak..
Step 1.
Dashboard > Template. Cari kode a:link, a:hover atau a:link pokoknya yang semacam itu.
Step 2.
Copy kode ini..
a.puppy{
cursor:vertical-text;
background:#000;
padding:5px;
width:50px;
color:#fff;
padding:0px;
border-radius:10px;
font-family: trebuchet ms;
font-size: 8.5px;
text-align: center;
text-decoration: none;
display:inline-block;
margin:2px;
}
p/s:
Text warna merah: cursor saat di hover ke navigate.
Text warna orange: background navigate
Text warna kuning: lebar navigate
Text warna hijau: kode warna font navigate
Text warna biru muda: border radius
Text warna biru tua: font navigate
Text warna ungu: ukuran font navigate
Text warna fuchsia posisi text navigate (center, left, right)
Paste kode itu di ATAS kode a:link, a:hover atau a:link pokoknya yang semacam itu.
Step 3.
<a class="puppy" href="URL LINK">Link 1</a>
p/s:
Text warna merah: Url link tujuan navigation.
Text warna orange: Judul/title navigate.
Paste kode <a class="puppy" href="URL LINK">Link 1</a> di mana-mana yang kamu suka.
Untuk membuat yang seperti punyaku itu, seperti ini..
Tinggal tambahin aja lagi kode <a class="puppy" href="URL LINK">Link 1</a>. Nanti akan jadi seperti ini..
<a class="puppy" href="URL LINK">Link 1</a>
<a class="puppy" href="URL LINK">Link 2</a>
<a class="puppy" href="URL LINK">Link 3</a>
<a class="puppy" href="URL LINK">Link 4</a>
<a class="puppy" href="URL LINK">Link 5</a>
Terakhir, save. Oh iya.. untuk yang seperti aku ini [coba klik navigate di samping kanan itu, langsung pergi ke tujuan tanpa buka link yang lain kan?] Insya Allah nanti akan kubuatkan. Bye~
