Friday 15 April 2011

Membuat Vertikal Menu Ala Kaskus

Malam-malam gini enaknya mosting tentang blogspot nih. Karena lagi banyak ide ya langsung aja deh nuangkan semua isinya kedalam postingan ini. Daripada disimpan terus, ntar akhirnya lupa. Tutorial kali ini membahas tentang cara membuat Vertikal Menu Ala Kaskus. Umumnya widget semacam ini hanya bisa kita temui di kaskus.us, Namun kali ini kita akan membuat hampir sama seperti Vertikal menu pada kaskus. Sedikit gambaran dari Vertikal Menu ala kaskus :
Itulah sedikit gambaran dari vertikal menu ala kaskusnya gan, widgetnya itu melayang juga loh, pokoknya hampir mirip deh kayak kaskus geto loh gan

Langkah-Langkah Membuat Vertikal Menu ala Kaskus :
  1. Login di blogger.com
  2. Pilih Rancangan --> Edit HTML
  3. Cari kode ]]></b:skin>
  4. Masukkan kode berikut sebelum kode diatas

    #alowadd {position:fixed;_position:absolute;top:137px; left:0px; clip:inherit; _top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
  5. Kemudian cari kode </body>
  6. Masukkan kode berikut sebelum kode </body>

    <div id='alowadd' style='padding: 45px 5px 5px 0pt; line-height: 25px; background: url(&quot;http://imgboot.com/images/Aloweis/bgadd_1.png&quot;) no-repeat scroll 0% 0% transparent; width: 71px; height: 198px; color: rgb(102, 102, 102); font-size: 12px;'> <a href='http://www.facebook.com/username' target='_blank' title='add me on facebook'><img border='0' src='https://lh6.googleusercontent.com/_jcl3_inylRg/TVFPwMmoEgI/AAAAAAAAAH0/zxOUojd3jIE/btn_f.png' style='margin-bottom: 3px;'/></a><br/> <a href='http://www.twitter.com/username' target='_blank' title='follow my twitter'><img border='0' src='https://lh5.googleusercontent.com/_jcl3_inylRg/TVFPw_VkwpI/AAAAAAAAAH4/YzrXzlSGkjE/s800/btn_t.png' style='margin-bottom: 3px;'/></a><br/><a href='http://feeds.feedburner.com/username' target='_blank' title='berlangganan artikel'><img src='https://lh4.googleusercontent.com/_jcl3_inylRg/TVFPw6WblbI/AAAAAAAAAH8/msxC5A6A1Pg/s800/comments_rss.png' style='margin-bottom: 3px;'/></a><br/><a href="http://www.aloweis.co.cc/2011/02/membuat-addfollow-me-ala-kaskus.html" target="_blank"><span style="font-size: small;">widget by 4-jie</span></a></div>
  7. Simpan
Keterangan !
Tulisan yang bercetak tebal dapat diganti dan disesuaikan dengan selera masing-masing


Sekian tutorial dari 4-Jie, kalau ada yang kurang jelas silahkan tinggalkan komentar dibawah

3 comments:

  1. Ane idam banget sama menu vertikal nya kaskus yang New gan.. agan bisa kasih tau cara buat bikinya gak..

    ReplyDelete