Jumat, 07 September 2012

Tips Membuat Scroll Blog List Pada Blogspot

Banyak sobat yang menggunakan gadget Bloglist (Daftar Blog) dari fasilitas blogger/blogspot pada sidebar blognya. Memang ada keuntungan disana. Dengan memamfaatkan gadget Bloglist ini kita bisa melihat setiap artikel-artikel terbaru dari blog-blog yang terdapat di dalamnya, sehingga kita dapat dengan mudah mengetahui setiap perkembangan dan topik bahasan artikel dari blog-blog tersebut.

Sayangnya, jika isi Bloglist ini terlalu banyak maka akan terlihat memanjang sehingga memenuhi halaman blog, dan kadang melebihi panjang halaman artikel yang dimuat. Bahkan sekalipun kita memilih opsi terpendek (5 blog yang ditampilkan), tetap saja apabila kita klik "selengkapnya" (Show all) padaBloglist tersebut maka akan memanjang memenuhi halaman blog. Tentu saja hal ini terlihat kurang rapih dan kurang menarik.

Untuk mengatasi hal itu sobat embun oengoe bisa menambahkan perintah scroll. Sepintas memang kelihatan sulit untuk menambahkannya karena gadget-nya bukan berupa HTML/JavaSript. Tapi sebenarnya cukup mudah dan simpel, kamu hanya cukup menambahkan perintah overflow dan mengatur ukuran tinggi(height)-nya, seperti terlihat pada blog Embun Oengoe ini.

Untuk mengetahui lebih jelas cara membuatnya sobat dapat mengikuti langkah-langkah berikut:
  • Dari halaman dasbor, klik Template - Edit HTML.
  • Beri tanda centrang pada Expand Template Widget.
  • Kemudian cari kode type='BlogList' (gunakan Control F atau F3).
  • Perhatikan kode yang ada di bawahnya, seperti ini: 
    <b:includable id='main'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
    </b:if>

    <div class='widget-content'>

  • Tambahkan perintah style='overflow:auto; height:200px' pada kode yang berwarna biru, sehingga menjadi seperti ini:
    <b:includable id='main'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
    </b:if>

    <div class='widget-content' style='overflow:auto; height:200px'>

  • Atur ukuran tinggi (height)-nya sesuai kebutuhan.
  • Klik SIMPAN
  • Selamat Mencoba...


Tidak ada komentar:

Posting Komentar

Buat sahabat yang mau sedot gambar DLL, silakan..
Jangan lupa tuk tinggalin jejak sobat dengan komentar pada blog ini supaya ane juga gampang berkunjung ke blog sobat.

Entri Populer

BACKLINK SITE

Memasang banner site yang menyediakan backlink otomatis sangatlah membantu tuk meningkatkan traffic blog kita karena selain anda pengunjungpun akan klik banner site baclink otomatis yang ada diblog anda nah hal ini yang akan membuat link anda akan terus nonggol diurutan pertama. survei membuktikan bahwa link yang nonggol di urutan pertama itu yang sering diklik visitor. Anda tertarik pasang banner backlink otomatis silahkan copy paste kode di bawah ini yang saya dapatkan dari site beberapa negara.
EMBUN OENGOESERIBU KAWANbacklinkgratis4ufreebanner4uSERIBU KAWANbertaubatlahiklanseribuartissexy17freebacklinks4usatriopiningitkatamutiara4usehatwalafiahiniinfo4uFree Automatic Linkiklansahabat2billiontraffic4uiklanwargaechange de liensseribusayangDAHOAM Free Backlinksbloggratiss4usurgalokaSERBA SERBISENI LUKISTEMPLATE GRATISWARGA BISNISAGUS FAUZYUnlimited BacklinkFree Automatic LinkFree Automatic Link4905GOBLOGANEKA VIDEOFree BacklinksBacklink ExchangeCalendario BiblicoFree Automatic LinkDie Gute SaatFree Automatic LinkFree Automatic LinkFECEBLOG 4UIFree Automatic LinksangrajamayaIntercambio de enlacessurgawebEnlaces GratisFree Automatic LinkFree Automatic LinkFree Automatic LinkbabulfatahFree Automatic Elvira Linksbacklinkgratis4uFree Automatic LinkFree Automatic LinkBUSANA MUSLIMFree BacklinksUnlimited Backlink ExchangeseribukatamutiaraUnlimited Backlink ExchangeTradiciones Peruanas de Ricardo PalmaAutomatic Backlink ExchangeFree Automatic LinkPlugboard Free Backlink ExchangeMariachi Backlink ExchangeWeb Link ExchangemajelisrasulullahText Backlink ExchangesLinkon Bedava - Free BacklinkText Back Links Exchangebedava - Free Backlink - www.linkdevi.comText Back Links Exchangesbedava - Free Backlink - www.v8link.com