Menu horizontal yang tata letaknya biasanya berada diatas adalah menu navigasi yang menurut saya merupakan alat untuk mempermudah pengunjung mencari artikel yang mereka cari
pengunjung senang tentu akan membuat blog kita ramai pengunjung, dan pageview akan meningkat dan alhasil rank alexa akan menurun, tentunya semua blogger inginkan itu.
maka dari itu tunggu apa lagi
ayo kita buat hehhe
ke tkp
-klik login pada blogger
-pilih menu template
-trus klik edit Html
-ceklist Expand Template Widget kotak kecil yang ada diatas sebelah kiri
-Setelah itu simpan templatepengunjung senang tentu akan membuat blog kita ramai pengunjung, dan pageview akan meningkat dan alhasil rank alexa akan menurun, tentunya semua blogger inginkan itu.
maka dari itu tunggu apa lagi
ayo kita buat hehhe
ke tkp
-klik login pada blogger
-pilih menu template
-trus klik edit Html
-ceklist Expand Template Widget kotak kecil yang ada diatas sebelah kiri
-Kemudian cari tag ]]></b:skin>
-Copy code dibawah ini dan letakan diatas tag ]]></b:skin>
.menu-solid{
margin: 0;
padding: 0;
float: left;
font: bold 12px Arial;
width: 100%;
border: 1px solid #625e00;
border-width: 1px 0;
background: #ebf225 ;
-moz-border-radius-topleft:7px;
-moz-border-radius-topright:7px;
-moz-border-radius-bottomleft:7px;
-moz-border-radius-bottomright:7px;
}
.menu-solid {
display: inline;
}
.menu-solid a{
float: left;
color: #000;
padding: 9px 11px;
text-decoration: none;
}
.menu-solid a:visited{
color: #cc0000;
}
.menu-solid a:hover, .menu-solid .current{
color: #ffffff;
background: #800000;
text-decoration:none;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
}
margin: 0;
padding: 0;
float: left;
font: bold 12px Arial;
width: 100%;
border: 1px solid #625e00;
border-width: 1px 0;
background: #ebf225 ;
-moz-border-radius-topleft:7px;
-moz-border-radius-topright:7px;
-moz-border-radius-bottomleft:7px;
-moz-border-radius-bottomright:7px;
}
.menu-solid {
display: inline;
}
.menu-solid a{
float: left;
color: #000;
padding: 9px 11px;
text-decoration: none;
}
.menu-solid a:visited{
color: #cc0000;
}
.menu-solid a:hover, .menu-solid .current{
color: #ffffff;
background: #800000;
text-decoration:none;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
}
Langkah selanjutnya adalah :
-klik menu tata letak
-pilih add datget/witget
-pilih Html/java script
-Copy code dibawah ini
Nb:
^ganti # dengan url sobat Contoh: http://dubraw735.blogspot.com
^ganti home menu menu2 dan menu 3 dengan nama yang sobat inginkan
Demikian Tutorial blog Cara Mudah Membuat Menu Horizontal Keren Blogspot
Page Load
0 komentar:
Posting Komentar
Terimakasih sudah berkomentar dengan baik, sopan dan tidak mengandung spam,dimohon untuk tidak meletakan link aktif dalam komentar!!!
Klik Subscribe by email jika ingin mengetahui update komentar pada artikel ini, thank you for visiting
Ttd : Dani Setiadi