Membuat Vertical Menu
Vertikal Menu merupakan pilihan menu yang biasa dipakai pada
website-website yang mempunyai banyak pilihan menu di dalamnya, vertikal
menu berbentuk pilihan menu yang turun kebawah jika kita sentuh dengan
menggunakan mouse kita.. dengan kita menggunakan vertikal menu ini maka
kita akan dapatkan pilihan menu yang banyak untuk blog kita
Nah saya akan memberikan cara pembuatannya pada blog.. ikuti caranya dan langkah-langkah nya dengan seksama, dengan anda mengikuti pastinya anda tidak akan mendapatkan kesulitan dalam pengeditan kode CSS nya
Masuk ke Akun Blogger Anda dan pilih layout terus cari Edit HTML
Masukkan kode CSS ini di atas kode ]]></b:skin>
/*Vertikal Menu
---------------------------------*/
.vertikalmenu{
list-style-type: none;
margin: 0;
padding: 0;
width: 180px; /* lebar dari menu vertikal*/
}
.vertikalmenu li{
border-bottom: 1px solid white;
}
.vertikalmenu li a{
background: #000000 ; /*warna dari menu vertikal*/
font: bold 13px "Lucida Grande", "Trebuchet MS", Verdana;
display: block;
color: white;
width: auto;
padding: 5px 0;
text-indent: 8px;
text-decoration: none;
border-bottom: 1px solid black;
}
.vertikalmenu li a:visited, .vertikalmenu li a:active{
color: white;
}
.vertikalmenu li a:hover{
background-color: #737373; /*warna setelah pointer diarahkan (hover)*/
color: white;
border-bottom: 1px solid black;
}
Kemudian SAVE
Anda bisa mengganti warna yang ada dengan warna yang anda sukai
Selanjutnya pilih Page Element dan kli add Page elemnet pilih lagi HTML/java Script
Masukkan kode ini didalamnya
<ul class="vertikalmenu">
<li><a href="/">» HOME</a></li>
<li><a href="http://your blog name.blogspot.com">» Tutorial Blog</a></li>
<li><a href="http://your blog name.blogspot.com">» Bisnis Online</a></li>
<li><a href="http://your blog name.blogspot.com">» Free Template</a></li>
<li><a href="http://your blog name.blogspot.com">» Handphone</a></li>
<li><a href="http://your blog name.blogspot.com">» Komputer</a></li>
</ul>
Ganti your blog name dengan nama blog milik anda
Klo sudah klik save.
selesai, selamat mencoba
Nah saya akan memberikan cara pembuatannya pada blog.. ikuti caranya dan langkah-langkah nya dengan seksama, dengan anda mengikuti pastinya anda tidak akan mendapatkan kesulitan dalam pengeditan kode CSS nya
Masukkan kode CSS ini di atas kode ]]></b:skin>
/*Vertikal Menu
---------------------------------*/
.vertikalmenu{
list-style-type: none;
margin: 0;
padding: 0;
width: 180px; /* lebar dari menu vertikal*/
}
.vertikalmenu li{
border-bottom: 1px solid white;
}
.vertikalmenu li a{
background: #000000 ; /*warna dari menu vertikal*/
font: bold 13px "Lucida Grande", "Trebuchet MS", Verdana;
display: block;
color: white;
width: auto;
padding: 5px 0;
text-indent: 8px;
text-decoration: none;
border-bottom: 1px solid black;
}
.vertikalmenu li a:visited, .vertikalmenu li a:active{
color: white;
}
.vertikalmenu li a:hover{
background-color: #737373; /*warna setelah pointer diarahkan (hover)*/
color: white;
border-bottom: 1px solid black;
}
Kemudian SAVE
Anda bisa mengganti warna yang ada dengan warna yang anda sukai
Selanjutnya pilih Page Element dan kli add Page elemnet pilih lagi HTML/java Script
Masukkan kode ini didalamnya
<li><a href="/">» HOME</a></li>
<li><a href="http://your blog name.blogspot.com">» Tutorial Blog</a></li>
<li><a href="http://your blog name.blogspot.com">» Bisnis Online</a></li>
<li><a href="http://your blog name.blogspot.com">» Free Template</a></li>
<li><a href="http://your blog name.blogspot.com">» Handphone</a></li>
<li><a href="http://your blog name.blogspot.com">» Komputer</a></li>
</ul>
Ganti your blog name dengan nama blog milik anda
Klo sudah klik save.
selesai, selamat mencoba
0 comments:
Posting Komentar
Kami menawarkan software atau game yang telah di posting pada situs ini untuk anda miliki dengan cara klik link Order DVD diatas atau SMS ke 085 730 281 770 dengan format :
ORDER DVD (spasi) Nama Aplikasi/Paket (spasi) Nama dan alamat lengkap anda lalu kirim sms ke 085 730 281 770