Cara membuat menu yang ikut naik turun -->

Cara membuat menu yang ikut naik turun

,
Jasa Google AdSense dan jasa pembuatan blog , pada postingan ini akan berbagi Tutorial blogger tentang menu di blogger tepatnya menu floating atau menu yang ikut naik turun jika halaman di geser
Tampilan untuk Menu pada blogger sebenarnya sudah disediakan oleh penyedia jasa situs yaitu www.blogger.com .
blogger yang masih domain gratis seperti blogspot atau yang sudah premium dotcom keduanya sudah disediankan alat untuk menampilkan sebuah menu dari blogger tersebut akan tetapi tampilan bawaan menu yang dari blogger jika halaman di scroll atau di gulir kebawa maka tampilan menu nya akan menghilang dan hal ini jika postinganya sangat panjang maka untuk mau berganti atau pindah menu yang lain harus dikembalikan lagi digulir keatas dan juga untuk pengunjung mau lihat-lihat daftar menu apa saja di blog yang sedang dikunjungi akan merasa kesulitan , oleh karena itu saya sebagai Admin Blog Mahadewa pulsa dan ppob - Blog tentang Agen pulsa - Tutorial blogger - download software dan lain lain pada kesempatan ini akan berbagi cara seputar ilmu blogger yaitu Cara membuat menu blogger ikut bergulir kebawah

seperti apasih Tampilan menu nya yang ikut bergulir kebawah jika di scroll , untuk lebih jelasnya lihat gambarnya di bawah ini

cara membuat menu floating

Gambar diatas sebagai contoh tampilan dari menu dropdown nya , jika diantara kalian ingin membuatnya silahkan simak panduanya dii bawah ini :

Cara membuat menu yang ikut naik turun (dropdown)
1. Buka blog anda klik desain untuk menuju dashboard blog
2. pilih Template lalu klik edit HTML 
3. cari kode di dalam HTML kode ini ]]></b:skin>
4. lalu copy kode di bawah ini dan letahkan kedalam HTML di atas kode ]]></b:skin> 

/* Floating Menu */
#ki_floating_menu{background-color: #1484CE;background: #1484ce;background: -moz-linear-gradient(top,  #1484ce 0%, #1274b5 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1484ce), color-stop(100%,#1274b5));background: -webkit-linear-gradient(top,  #1484ce 0%,#1274b5 100%);background: -o-linear-gradient(top,  #1484ce 0%,#1274b5 100%);background: -ms-linear-gradient(top,  #1484ce 0%,#1274b5 100%);background: linear-gradient(to bottom,  #1484ce 0%,#1274b5 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1484ce', endColorstr='#1274b5',GradientType=0 );border-bottom: 1px solid rgba(255, 255, 255, 0.1);box-shadow: 0 2px 0 #0E5A8C;box-shadow: 0px 2px 0px #0e5a8c;height:34px;width:100%;min-width:970px;position:fixed;top:0;left:0;z-index:9999;overflow:hidden;border-bottom:1px solid #2a8fd2;}
#ki_floating_menu ul{list-style: none;margin:0 auto;width:970px;}
#ki_floating_menu ul li{float:left}
#ki_floating_menu ul li a{line-height:34px;padding:0 15px;color:#FFFFFF;font-size:13px;font-family:Arial, sans-serif;text-shadow:0px -1px 0px #0f669f;display:block;text-decoration:none;border-right: 1px solid #1470ad;border-left:1px solid #2a88c6;}
#ki_floating_menu ul li a:hover{background-color:rgba(255,255,255,0.125);color:white;}

5. jika sudah meletahkan kode di atas sesuai panduan , sekarang cari lagi kode di dalam HTML kode ini </head>
6. lalu copy lagi kode di bawah ini dan letakan atau pastekan kedalam HTML di bawah kode </head>

<!-- Floating Menu-->
<div id='ki_floating_menu'>
<ul>
  <li style='border-left:1px solid rgba(30, 30, 30, 0.125);'><a href='/'><img alt='Home' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIXLXmVUE1UadXpUfaiuR1uISWO003XyBN8yDF6xMF8TY94QXiQSD1ex_1nq026bNrl5s84KTlU-_T4OJZxYMKAQm54G_SAxD9ZdUZN_eJJXVRK0wt2jdAy2x8_rPDISOB3UEpi2Vs_H0/s1600/home.jpg' style='padding:0px;'/></a></li>
<li><a href='url anda'>Menu 1</a></li>
<li><a href='url anda'>menu 2</a></li>
<li><a href='url anda'>Menu 3</a></li>
<li ><a href='https://jasabikin-website.blogspot.com/software'>Download</a></li>
<li><a href='https://jasabikin-website.blogspot.com/'>Tutorial Blogger </a></li>
<li><a href='https://jasabikin-website.blogspot.com/p/beranda.html'>Jasa murah bikin Blog </a></li>
</ul>
</div>

Keterangan kode :
- kode di atas yang warna merah adalah url Tujuan menu
- kode yang warna pink adalah nama menu nya
- kode di atas yang warna hijau sebagai contoh url dari menunya ( boleh di ganti tapi kalau ga di ganti juga tidak apa-apa )

7. jika sudah meletahkan ke dua kode di atas sesuai panduanya silahkan klik Pratinjau template dulu fungsinya untuk mengecek template nya eror atau tidak / meletahkan kodenya sudah benar atau belum
8. jika sudah benar /  tidak eror lalu simpan template nya
9. selesai..

untuk mengecek pembuatan menunya atau menu floating silahkan buka beranda blog 

Sampai disini Tutorial blog Mahadewa Pulsa jasa website Yang telah membahas Cara membuat Menu floating atau menu yang ikut jika di scrol kebawah ke atas , semoga berguna . Terimaksih


TerPopuler