13 Jul 2011

Share : Membuat Commentar dengan Scroll

assalamualaikum wr.wb
Halo sharelikers sekalian apa kabar nya ?Kali ini yang penting share ingin mendokumentasikan trik yang udah lama di dunia persilatan eh Perbloggeran namun layak untuk dishare dan didokumentasikan,yaitu Share : Membuat Commentar dengan Scroll .Trik ini awalnya saya ketahui dari sobat setia saya Ladida cafe,Ya trik ini sebenarnya sangat sederhana,cuma karena saya dulunya tidak mengetahui dimana harus meletakkan elemen ini,maka saya menunda untuk mempostingnya hingga saat ini.Tapi sekarang elemen template sudah saya ketahui dan sudah layak saya post trik Share : Membuat Commentar dengan Scroll keren ini.Selain menghemat tempat juga menambah simple bentuk hasil komentar sobat sekalian.Mau tau caranya ??Yuk kita simak saja langkah yang sudah saya dokumentasikan ini :
  • Loggin Ke blogger 
  • lalu kemudian Klik rancangan~Edit Html
  • Centang Expand Widget Template
  • lalu cari kode Css yang serupa berikut ini dengan menggunakan Ctrl+F
#comments-block {margin:1em 0 1.5em;line-height:1.6em;position:relative;}
  • Lalu tambahkan Kode Overflow Auto dan ukuran height (dalam satuan px) atau tinggi yang kita inginkan sehingga kodenya menjadi

#comments-block {overflow:auto;height:300px;margin:1em 0 1.5em;line-height:1.6em;position:relative;}
  • Kemudian save Template sobat.
Trik ini tidak bisa dilihat untuk versi handphone atau http://ypsrandy.blogspot.com?m=1
Nah sekian dulu penggunaan atribut Overflow auto untuk membuat scroll pada kotak Komentar.Hasilnya busa sobat liat pada komentar dibawah ini (bila komentar nya banyak sih).semoga trik ini bisa membuat Blog sobat lebih simple dalam urusan desain.Thanks buat semua sharelikers yang tidak bosen-bosennya maen ke Yang Penting Share,salam Sharing dari yang penting share,met beraktivitas

Tampilan terbaik menggunakan Google chrome dan Mozilla +5 layar 1280x854

21 comments:

  1. wah keren nih. Tapi kolom komentarnya masuk scroll juga gak mas?

    ReplyDelete
  2. ini lebarnya otomatis menyesuaikan sama lebar postingan blog? kok gak ada keterangan width:auto? kalo kita sesuaikan lebarnya juga bisa gak [selain tingginya]?

    ReplyDelete
  3. @DAW-XP gak mas deny gak masuk tapi bisa juga mas deny edit sesuai selera dengan memasukkannya kedalam scroll tambah kode
    #comments {
    height:400px;
    overflow:auto;
    }
    dibawah /* Comments
    -------------------------- */

    ReplyDelete
  4. @Dokter Gigi iya mas gak perlu soalnya width bakal nyesuain sesuai ukuran post hentry(100%).Kalo ditambah atribut width juga gpp,mgkin mau ngecilin ukurannya.:D

    ReplyDelete
  5. waaah manntaaaap nieh sob...

    ReplyDelete
  6. sipp nih, saya juga udah pake nih . .

    1 klik balasan di sini bang!!

    ReplyDelete
  7. @Ladida hohoho master tipsnya datang oke bang makasih :D

    ReplyDelete
  8. oke om admin, tengkyu umpanbaliknya.. :D

    ReplyDelete
  9. @Dokter Gigi sama2 om :D sudah kewajiban bwat jawab komeng

    ReplyDelete
  10. salam sahabat
    bagus caranya simple tapi kalau tidak tersedia versi ponsel saya kabur karena scroll komentar jika di show pada ponsel kadang gak muncul hehehehe

    ReplyDelete
  11. @Dhana/戴安娜 salam sahabat mba owh gitu yah mba??hem saya belum coba versi draftnya ntar saya test :D

    ReplyDelete
  12. Owh gitu toh caranya, gue baru tau, thanks sob, kalo gue bosen sama kotak komentar bawaan ya gue pake cara ini deh.. haha.. :D

    ReplyDelete
  13. @Feby Oktarista Andriawanhahha lo ada2 aje feb,tuh bukan ganti kotak komeng tapi ngeditnya biar ada scroll

    ReplyDelete
  14. scroll menghemat tempat gan

    ReplyDelete
  15. biar kaya punya ente yah... saya mah yg coment cuma sedikit.. jd blm butuh, heuheuheuh...

    but.. nice share n thnx dah comeng :D

    ReplyDelete
  16. @Dedy iya biar kayak punya saya bang hehehe Ehm abang merendahh ah padahal bnykan abang komennya dari blog saya #malu

    ReplyDelete