Headlines News :

Membuat Menu Navigasi Vertikal di Blog

Ahmad Ridoan Pasid-XP Updated at : 00:44
Membuat Menu Navigasi Vertikal di Blogger - Menu navigasi sangat berperan penting Untuk memudahkan pengunjung dalam menjelajahi blog kita, namun sayangnya template default blogger/blogspot tidak menyediakan plugin otomatis untuk membuat menu navigasi.

Namun jangan khawatir sebab telah banyak blog yang membahas tentang cara pemasangan atau cara membuat menu navigasi Horisontal maupun Vertikal secara manual pada blog.

Nah pada kesempatan kali ini saya ingin berbagi sebuah artikel tentang cara membuat menu navigasi vertikal pada
blog.

Untuk membuatnya ikuti langkah-langkah berikut ini:

  • Pertama-tama masuklah ke akun blogger milik anda
  • Kemudian Pilih Rancangan/Tata Letak
  • Lalu Klik tambah gadget , Pilih Html/Javascript
  • Selanjutnya Copy dan Pastekan kode dibawah ini kedalam kolom yang telah disediakan
<style>
.menu-vertikal, .menu-vertikal li ul{list-style-type: none;margin: 0px;width: 145px; /*Lebar Menu*/border: 1px solid black;}
.menu-vertikal li{position: relative;}
.menu-vertikal li a{background: #145A9C;font: bold 12px Verdana, Helvetica, sans-serif;color: #FFFFFF;display: block;width: auto;padding: 5px 0;padding-left: 10px;text-decoration: none;}
.menu-vertikal li ul{position: absolute;width: 250px;display: none;}
.menu-vertikal li ul li{float: left;}
.menu-vertikal li ul a{width: 145px;}
.menu-vertikal li a:visited, .glossymenu li a:active{color: white;}
.menu-vertikal li a:hover{background: #0E3860;}
* html .menu-vertikal li { float: left; height: 1%; }
* html .menu-vertikal li a { height: 1%; }
</style>
<ul id="verticalmenu" class="menu-vertikal">
<li><a href="http://pasid-xp.blogspot.com/search/label/Sidimpuan%20Sumut">Sidimpuan</a></li>
<li><a href="http://pasid-xp.blogspot.com/search/label/Info%20Bisnis">Bisnis</a></li>
<li><a href="http://pasid-xp.blogspot.com/search/label/game">Game</a></li>
<li><a href="http://pasid-xp.blogspot.com/search/label/software">Software</a></li>
</ul>
  • Namun sebelumnya ubah terlebih dahulu url link sesuai dengan kategori blog anda
  • Terakhir simpan dan lihat hasilnya
Keterangan: Ukuran dan warna bisa anda sesuaikan menurut selera anda
Selamat mencoba semoga artikel tersebut bermanfaat untuk anda
Rating Artikel : 5 Jumlah Voting : 99 Orang
thumbnail Title: Membuat Menu Navigasi Vertikal di Blog
Posted by: Ahmad Ridoan
Published : 2012-07-22T00:44:00+07:00
Rating: 4.9
Reviewer: 3592 Reviews
Membuat Menu Navigasi Vertikal di Blog
Share this post :
 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Pasid-XP - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger