Cara Membuat Menu Slide Melayang Di Pinggir Blog

KUCOPAS - Cara Membuat Menu Slide Melayang Di Pinggir Blog. Pada posting sebelumnya saya share artikel tentang Cara Menu Drop Down Horisontal Melayang Di Blog, dan kali ini saya akan berbagi lagi trik tentang cara membuat Menu Slide melayang di pinggir blog.

Fungsi Menu Slide melayang di pinggir blog ini bisa terlihat sangat simpel dan mempercantik untuk blog sobat, karena menu ini hanya akan kelihatan judul menunya saja. Namun bila mouse pointer diarahkan pada menu ini maka akan terjadi open slide dan akan memperlihatkan semua menu yang ada di dalamnya.

Oke kita langsung saja ke intinya saja, Bagi sobat yang ingin tahu tentang Cara Membuat Menu Slide Melayang Di Pinggir Blog, silahkan sobat ikuti panduan dan langkah-langkahnya dibawah ini.

1. Silahkan >> "Login/Masuk" >> ke blog sobat.

2. Pilih >> Rancangan atau pilih >> Menu Template pada tampilan baru Blogger, kemudian pilih >> Edit HTML.

3. Langkah selanjutnya sobat cari kode </head> (Gunakan CTRL+F untuk mempermudah pencarian).

4. Kemudian taruh semua kode script dibawah ini, tepat diatas atau sebelum kode </head>

    <script src='http://kucopas-js.googlecode.com/files/MenuFloating.js' type='text/javascript'/>

    <script>

    YOffset=150;

    XOffset=0;

    staticYOffset=30;

    slideSpeed=20

    waitTime=100;

    menuBGColor=&quot;red&quot;;

    menuIsStatic=&quot;yes&quot;;

    menuWidth=120;

    menuCols=3;

    hdrFontFamily=&quot;verdana&quot;;

    hdrFontSize=&quot;2&quot;;

    hdrFontColor=&quot;black&quot;;

    hdrBGColor=&quot;#FF0000&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;#FFFF99&quot;;

    linkTarget=&quot;_top&quot;;

    linkAlign=&quot;Left&quot;;

    barBGColor=&quot;red&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;OPTION :&quot;] //Header Menu

    ssmItems[1]=[&quot; Home&quot;, &quot;/&quot;, &quot;&quot;]

    ssmItems[2]=[&quot; About Me&quot;, &quot;http://kuc0pas.blogspot.com/&quot;,&quot;&quot;]

    ssmItems[3]=[&quot; Tutorial Blog&quot;, &quot;http://kuc0pas.blogspot.com/&quot;,&quot;&quot;]

    ssmItems[4]=[&quot; Tips Blog&quot;, &quot;http://kuc0pas.blogspot.com/&quot;,&quot;&quot;]

    ssmItems[5]=[&quot; Buku Tamu&quot;, &quot;http://kuc0pas.blogspot.com/&quot;, &quot;_new&quot;]

    ssmItems[6]=[&quot; Trik Facebook&quot;, &quot;http://kuc0pas.blogspot.com/&quot;, &quot;&quot;]

    ssmItems[7]=[&quot; Sport&quot;, &quot;http://kuc0pas.blogspot.com/&quot;, &quot;&quot;]

    buildMenu();

    //----- Selesai Edit Menu

    </script>

5. Silahkan sobat klik >> Pratinjau (Preview), jika hasilnya sudah seperti yang sobat inginkan, kemudian klik >> Simpan dan lihat hasilnya.

Keterangan:

• Warna BIRU ganti dengan Judul Menu sobat.

• Warna MERAH ganti dengan URL Link sobat.

Semoga tutorial tentang Cara Membuat Menu Slide Melayang Di Pinggir Blog, bisa sangat bermanfaat untuk sobat KUCOPAS semua.