Kali ini saya
akan membahas membuat Daftar Menu Pada Blog. Daftar Menu ini berfungsi
memudahkan Fisitor mencari artikel yang Sobat postkan sesuai dengan labelnya.
Caranya:
- Seperti biasa
sobat mesti login dulu ke blog sobat
- Silahkan klik Tata letak
- Klik tambah gadget/add gadget
- Klik opsi HTML / Javascript
- Silahkan sobat Copy dan Paste Kode HTML di bawah ini :
- Silahkan klik Tata letak
- Klik tambah gadget/add gadget
- Klik opsi HTML / Javascript
- Silahkan sobat Copy dan Paste Kode HTML di bawah ini :
<style>
/*---------------------------------------------------------------------------------*/
/* CATEGORY MENU */
/*---------------------------------------------------------------------------------*/
#cat-menu { background:none; height:35px;}
/* category navigation */
.nav { background:#f5f5f5;width:100%;z-index:99; float:left; margin:5px 0 10px 0; padding:0px; list-style:none; height:35px;}
.nav a { position:relative; color:#555; display:block; z-index:100; text-decoration:none; }
.nav li { float:left; width:auto; border-right:1px solid #d9d9d9; }
.nav li a { font:bold 11px/15px Arial,serif; padding:10px 12px; text-decoration:none; text-transform:uppercase; }
.nav li a:hover{ background:#333; color:#fff; text-decoration:underline;}</style>
<div id='cat-menu'>
<ul class='sf-menu nav' id='cat-nav'>
<li><a href='http://viecha-ali.blogspot.com/'> Beranda</a></li>
<li><a href='URL label Sobat'> Nama menu (Label)</a></li><li><a href='URL label Sobat'> Nama menu (Label)</a></li>
<li><a href='URL label Sobat'> Nama menu (Label)</a></li>
<li><a href='URL label Sobat'> Nama menu (Label)</a></li>
<li><a href='URL label Sobat'> Nama menu (Label)</a></li>
</ul>
</div>
/*---------------------------------------------------------------------------------*/
/* CATEGORY MENU */
/*---------------------------------------------------------------------------------*/
#cat-menu { background:none; height:35px;}
/* category navigation */
.nav { background:#f5f5f5;width:100%;z-index:99; float:left; margin:5px 0 10px 0; padding:0px; list-style:none; height:35px;}
.nav a { position:relative; color:#555; display:block; z-index:100; text-decoration:none; }
.nav li { float:left; width:auto; border-right:1px solid #d9d9d9; }
.nav li a { font:bold 11px/15px Arial,serif; padding:10px 12px; text-decoration:none; text-transform:uppercase; }
.nav li a:hover{ background:#333; color:#fff; text-decoration:underline;}</style>
<div id='cat-menu'>
<ul class='sf-menu nav' id='cat-nav'>
<li><a href='http://viecha-ali.blogspot.com/'> Beranda</a></li>
<li><a href='URL label Sobat'> Nama menu (Label)</a></li><li><a href='URL label Sobat'> Nama menu (Label)</a></li>
<li><a href='URL label Sobat'> Nama menu (Label)</a></li>
<li><a href='URL label Sobat'> Nama menu (Label)</a></li>
<li><a href='URL label Sobat'> Nama menu (Label)</a></li>
</ul>
</div>
- Ganti http://viecha-ali.blogspot.com/ dengan URL Blog Sobat
- Sobat Bisa Ganti Beranda dengan Judul sesuka sobat semisal Home, Halaman Muka, dll
- Ganti URL label Sobat semisal http://viecha-ali.blogspot.com/search/label/Unique Spot
- Ganti Nama menu (Label) dengan Nama Menu yang Sobat inginkan contoh : Unique Spot
- Sobat juga bisa menambah / mengurangi Munu sobat dengan menambah/ mengurangi
<li><a href='URL label Sobat'> Nama menu (Label)</a></li>
Sekian,,,,
Tidak ada komentar:
Posting Komentar