Headline
Loading...

Menu Drop Down Tanpa Edit Html di Blogger


Langkah-langkah membuat tab menu navigation horizontal
  • Dalam keadaan sig in pada account blogger sobat, pada dasbor => klik Tata Letak=> klik Elemen Halaman
  • Klik Tambah Gadget pada kolom elemen halaman dibawah header atau diatas header 
  • Pilih HTML/JavaScript
  • Copy semuae kode tab yang terdapat dalam teks area dibawah tab navigator horizontal pilihan sobat dan paste pada kolom konten


<style>
/* -- Menu Horizontal + Sub Menu-- */
#cat-nav {background:#fff;margin:0 15px;padding:0;height:35px;}
#cat-nav a { color:#999; text-decoration:none; text-shadow:#eee 0px 1px 0px;border-right:0px solid #000;}
#cat-nav li a:hover { color:#4682B4; }
#cat-nav a span { font-family:Gisha, Geneva, sans-serif; font-size:13px; font-style:normal; font-weight:400; color:#000; text-shadow:none;}
#cat-nav .nav-description { display:block; }
#cat-nav a:hover span { color:#000; }
#secnav, #secnav ul { position:relative; z-index:100; margin:0; padding:0; list-style:none; line-height:1; background:#fff; }
#secnav a { font-family:Gisha, "Gisha", Times, serif; font-style:Normal; font-weight:400; font-size:13px; display:block; z-index:100; padding:0 15px; line-height:35px; text-decoration:none;}
#secnav li { float:left; width: auto; height:35px;}
#secnav li ul  { position: absolute; left: -999em; width: 200px; top:35px}
#secnav text-align:left;
#secnav li ul li a  { font-family:Gisha, Geneva, sans-serif; width:180px; line-height:30px; padding:0 10px; font-size:13px; font-style:normal; font-weight:400; color:#999; }
#secnav li ul ul  { margin: -30px 0 0 180px; }
#secnav li:hover ul ul, #secnav li:hover ul ul ul, #secnav li.sfhover ul ul, #secnav li.sfhover ul ul ul { left:-999em; }
#secnav li:hover ul, #secnav li li:hover ul, #secnav li li li:hover ul, #secnav li.sfhover ul, #secnav li li.sfhover ul, #secnav li li li.sfhover ul { left: auto; }
#secnav li:hover,#secnav li.hover  { position:static; }
#cat-nav #secnav {width:100%;margin:0 auto;}
</style>
<div id='cat-nav'>
<ul class='fl' id='secnav'>
<li><a href='http://sanggar-belajar.blogspot.com/search/label/Jaringan'>Jaringan</a></li>
<li><a href='#'>E-Tools &#9662;</a>
<ul id='sub-custom-nav'>
<li><a href='http://border-radius.com/' target="_blank">✍ Border Radius Generator</a></li>
<li><a href='http://mini-web-tools.googlecode.com/svn/p/css-compressor-and-beautifier.html' target="_blank">✍ CSS Compresor</a></li>
<li><a href='http://css3maker.com/' target="_blank">✍ CSS 3 Maker</a></li>
<li><a href='http://jsbeautifier.org/' target="_blank">✍ Java Script Beautifier</a></li>
<li><a href='http://tools.irvankadhafi.com/jsencrypt/' target="_blank">✍ Java Script Encryptor</a></li>
<li><a href='http://minifyjavascript.com/' target="_blank">✍ Minify JavaScript</a></li>
<li><a href='http://cssmenumaker.com/' target="_blank">✍ CSSS Menu Maker</a></li>

</ul>
</li>
<li><a href='http://sanggar-belajar.blogspot.com/search/label/Tutorial%20Blog'>Tutorial Blog</a></li>
<li><a href='#'>Microsoft Office &#9662;</a>
<ul id='sub-custom-nav'>
<li><a href='http://sanggar-belajar.blogspot.com/search/label/Microsoft%20Word'>✍ Tutorial Microsoft Word</a></li>
<li><a href='http://sanggar-belajar.blogspot.com/search/label/Microsoft%20Excel'>✍ Tutorial Microsoft Excel</a></li>
<li><a href='http://sanggar-belajar.blogspot.com/search/label/Microsoft%20Power%20Point'>✍ Tutorial Power Point</a></li>
</ul>
</li>
<li><a href='http://sanggar-belajar.blogspot.com/p/kti-judul-skripsi_20.html'>KTI-Skripsi</a></li>
<li><a href='#'>Bank Soal &#9662;</a>
<ul id='sub-custom-nav'>
<li><a href='#'>✍ Bank Soal SMA</a></li>
<li><a href='#'>✍ Bank Soal SMP</a></li>
<li><a href='#'>✍ Bank Soal SD</a></li>
<li><a href='#'>✍ Bank Soal Olimpiade</a></li>
<li><a href='#'>✍ Bank Soal UKA-UKG</a></li>
<li><a href='#'>✍ Bank Soal Test PN</a></li>
</ul>
</li>
<li><a href='http://sanggar-belajar.blogspot.com/search/label/Software'>Software</a></li>
<li><a href='#'>Link Dinas &#9662;</a>
<ul id='sub-custom-nav'>
<li><a href='http://www.kemdiknas.go.id/kemdikbud/' target="_blank">✍ Kemendiknas Indonesia</a></li>
<li><a href='http://dikdas.kemdiknas.go.id/' target="_blank">✍ Dirjen Pendidikan Dasar</a></li>
<li><a href='http://infopendataan.dikdas.kemdiknas.go.id/new/index.php/' target="_blank">✍ Info Pendataan Dikdas</a></li>
<li><a href='http://203.171.221.242/sipdikmen/html/index.php' target="_blank">✍ Pendataan Pend. Menegah</a></li>
<li><a href='http://dikmen.kemdikbud.go.id/html/index.php' target="_blank">✍ Dirjen Pendi. Menengah</a></li>
<li><a href='http://padamu.kemdikbud.go.id/' target="_blank">✍ Padamu Negeri Siap</a></li>
</ul>
</li>
<li><a href='http://sanggar-belajar.blogspot.com/search/label/Widget%20Blog'>Widget Blog</a></li>
</ul>
</div>
Selamat Mencoba Semoga Berhasil
di 16.32

1. Berikan Komentar Anda Sesuai dengan Judul Artikel.
2. Komentar yang menyertakan link aktif, iklan, atau titip link, akan dimasukan ke folder SPAM.
3. Untuk pertanyaan Out Of Topic ( OOT ) silahkan klik Forum

Konversi KodeEmotionForum

Back to Top