Menu Dropdown Tersembunyi Blog Versi Jquerry Tips and Trik Blog

Jika anda menginginkan tampilan yang unik sekaligus tidak "berat" saat membuka halaman blog, mungkin ini  adalah cara yang tepat untuk anda coba. Ini adalah tampilan menu yang simple tapi bagus untuk dilihat. Di samping itu tampilan menu ini tidak membuat halaman blog anda "berat" pada saat membuka blog, jadi tenang saja. Hanya saja nanti anda akan "puyeng" mengedit-edit kode scriptnya. Hehehe.

Jika anda ingin melihat contoh menu ini, silahkan klik disini.
Nah, anda juga bisa mengedit-edit menu-menu itu kok.
Berikut ini caranya:

1. Masuk ke akun blogger anda.
2. Pilih Rancangan
3. Pilih EDIT HTML
4. Untuk keamanan, sebaiknya anda download template lengkap dulu.
5. Gunakan CTRL+F untuk memudahkan pencarian
6. Cari kode </head>
7. Copy Seluruh script dibawah ini, kemudian paste tepat bawah </head>:
   

   <script src=http://elmubarok.googlecode.com/files/floating1.js type=text/javascript/>

   <script>

   YOffset=150;

   XOffset=0;

   staticYOffset=30;

   slideSpeed=20

   waitTime=100;

   menuBGColor=&quot;#cc0000&quot;;

   menuIsStatic=&quot;yes&quot;;

   menuWidth=120;

   menuCols=3;

   hdrFontFamily=&quot;verdana&quot;;

   hdrFontSize=&quot;2&quot;;

   hdrFontColor=&quot;black&quot;;

   hdrBGColor=&quot;#cc0000&quot;;

   hdrAlign=&quot;left&quot;;

   hdrVAlign=&quot;center&quot;;

   hdrHeight=&quot;15&quot;;

   linkFontFamily=&quot;Verdana&quot;;

   linkFontSize=&quot;2&quot;;

   linkBGColor=&quot;white&quot;;

   linkOverBGColor=&quot;#cc0000&quot;;

   linkTarget=&quot;_top&quot;;

   linkAlign=&quot;Left&quot;;

   barBGColor=&quot;#cc0000&quot;;

   barFontFamily=&quot;Verdana&quot;;

   barFontSize=&quot;2&quot;;

   barFontColor=&quot;white&quot;;

   barVAlign=&quot;center&quot;;

   barWidth=20; // no quotes!!

   barText=&quot;MENU&quot;;

   // ----- Mulai Edit Menu
   ssmItems[0]=[&quot;JUDUL :&quot;] //Header Menu
   ssmItems[1]=[&quot;BERANDA&quot;, &quot;/&quot;, &quot;&quot;]
   ssmItems[2]=[&quot;GOTRIOGO&quot;, &quot;URL&quot;,&quot;&quot;]
   ssmItems[3]=[&quot;GOTRIOGO&quot;, &quot;URL&quot;,&quot;&quot;]
   ssmItems[4]=[&quot;GOTRIOGO&quot;, &quot;URL&quot;,&quot;&quot;]
   ssmItems[5]=[&quot;GOTRIOGO&quot;, &quot;URL&quot;,&quot;&quot;]
   ssmItems[6]=[&quot;GOTRIOGO&quot;, &quot;URL&quot;,&quot;&quot;]
   ssmItems[7]=[&quot;GOTRIOGO&quot;, &quot;URL&quot;,&quot;&quot;]
   buildMenu();
   //----- Selesai Edit Menu
   </script>

   Kode berbackground ABU-ABU adalah tempat anda mengedit-edit tampilan menunya. Itu PR buat anda. Hehehe.
   Kode berbackground KUNING adalah nama halaman.
   Sedangkan kode berbackground BIRU MUDA adalah nama URL halaman.
8. Setelah anda mengedit-editnya, silahkan SAVE TEMPLATE, lalu lihat hasilnya.

GOODLUCK

Read More..