About - Contact - Privacy Policy - Terms - Disclaimer - Sitemap

Membuat Menu Navigasi Sederhana di Blogger

Berhubung banyak teman yang menanyakan bagaimana membuat menu navigasi di blogger, dari pada ane kasih kode jadi buat dicopy paste mending ane kasih bahannya saja, jadi bisa dikreasikan sesuai selera teman-teman , kode ini ane buat sendiri heheheh :v

Pertama-tama teman login ke blogger dulu, lalu masuk ke menu template dan masuk ke edit html
Silahkan cari pada template teman-teman tag "/b:skin>" tanpa tanda kutip atau dengan cara ctrl+f dan ketik "/b:skin>" tanpa tanda kutip.
taruh kode css ini di atas /b:skin>

#menu-nav{
/** ubah 1000px sesuaikan dengan panjang menu yang diinginkan **/
width: 1000px;
/** ubah 49px sesuaikan dengan tinggi menu yang diinginkan **/
height: 49px;
/** ubah #000 untuk mengganti background menu misal jadi #fff untuk warna putih **/
background: #000;
margin: 0px auto;
box-shadow: 0px 0px 3px 0px;
}
#menu-nav a{
text-decoration: none;
display: block;
padding: 12px 12px;
/** ubah #fff untuk mengganti warna tulisan misal **/
color: #fff;
}
#menu-nav ul{
list-style: none;
margin: 0px auto;
float: left;
padding: 3px 3px;
}
#menu-nav li{
list-style: none;
float: left;
text-decoration: none;
width: 100px;
text-align: center;
}
#menu-nav li:hover{
background: #000;
list-style: none;
float: left;
text-decoration: none;
border-bottom: solid #fff 3px;
}

Kemudian teman cari lagi kode <div id='outer-wrapper'>  dan taruh kode di bawah ini diatasnya , lalu ganti kode pagar # berwarna biru dengan link label teman-teman

<div id='menu-nav'>
<ul>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li><a href='
#'>Tugas</a></li>
<li><a href='
#'>Dll</a></li>
<ul>
</div>

Untuk hasil jadinya silahkan dilihat dicoba diklik disorot, di bawah ini :


Sok lur lah aya anu teu kaharti mah koment we :D

0 Response to "Membuat Menu Navigasi Sederhana di Blogger"

Post a Comment