31 December 2011

» » Membuat Scroll Box pada Blog Archive

Membuat Scroll Box pada Blog Archive


Sidebar dari blog ini berada di sebelah kanan blog post, Sobat blogger bisa lihat sendiri sebenarnya tanpa perlu saya jelaskan. Terdapat widget Arsip Blog disana yang saya setting dengan setting Dropdown Menu. Kalau kita menggunakan Kalu saya gunakan setting Flat List, maka arsip blog saya akan terlihat seperti gambar di bawah ini :

arsiv blog, archieve blog, blog archieve, scroll box blog archieve, scrolling blog arsip

Dan kalau saya atur secara Hierarchy, maka arsip blog saya akan tampil seperti ini:

arsiv blog, archieve blog, blog archieve, scroll box blog archieve, scrolling blog arsip

Kalau jumlah post atau artikel yang kita sudah publikasikan di atas 100 (Seratus) kemudian kita setting arsip blog kita dengan Hierarchy atau Flat List, tentunya widget arsip blog kita akan terlihat panjang. Solusi yang paling tepat untuk mengatasi tampilan widget arsip blog yang terlalu panjang adalah dengan cara Membuat Scroll Box pada Blog Archive. Bagimana cara membuatnya? Ikuti langkah-langkah berikut:

Cara Membuat Scroll Box pada Blog Archive :
  • Sign In di http://www.blogger.com/
  • Klik Menu Rancangan, lalu pilih Edit HTML.
  • Kasih tanda Centang pada Expand Widget Template
  • Cari kode berikut <div id='ArchiveList'>
  • Perhatikan kode sebelum kode tersebut!

arsiv blog, archieve blog, blog archieve, scroll box blog archieve, scrolling blog arsip

  • Hapus kode <div class='widget-content'>
  • Lalu ganti dengan <div class='widget-content' style='overflow:auto; height:200px'>
  • Klik Simpan Template

Tambahan :
200px adalah ukuran tinggi Scroll Box, Silahkan disesuaikan dengan tinggi Scroll Box yang sobat blogger inginkan



Baca tutorial menarik lainnya di bawah ini :

Posted by

19 comments:

  1. UnknownFebruary 20, 2012 at 6:21 AM

    ini kelihatannya lebih simple ane coba dolo gan, makasoh untuk share triknya

    ReplyDelete
  2. UnknownFebruary 20, 2012 at 1:59 PM

    Wahid Sahidu...
    Cara itu memang sangat mudah...
    Silahkan di coba...
    Insyaallah berhasil.

    ReplyDelete
  3. ChumChumSoftFebruary 22, 2012 at 9:47 AM

    nice tutorial :)
    simple ..!

    klo smpet mampir lah kgubuk reyot ane di http://chumchumsoft.blogspot.com/
    heheheh

    salam blogger! ;)

    ReplyDelete
  4. UnknownFebruary 22, 2012 at 1:35 PM

    Chum Chum Soft...
    Wait me there!!!
    I am going to visit your blog.

    ReplyDelete
  5. aneka ragam makalahMarch 22, 2012 at 5:26 PM

    terima kasih sob atas artikelnya, tetapi setelah saya coba tidak berhasil dan kode yang saya masukkan error, gimana tu?

    oya tukeran link yuk agar menambah keakraban kita hee..hee

    ReplyDelete
  6. MuhamMad IrwansyAhApril 18, 2012 at 5:46 AM

    wow gampang bgt cara nya (y)

    ok mas thanks banyak yaa atas postingan nya
    bermanfa'at bgt ni

    jangan Lupa mampir ya
    http://irwantz.blogspot.com/

    ReplyDelete
  7. Esteller MellerApril 22, 2012 at 2:36 PM

    kok g bisa ya bos ,padahal saya udah masukin cara2 tersebut

    ReplyDelete
  8. heriJune 26, 2012 at 1:18 AM

    punya saya kok error ya mas...udah bisa jadi scroll tapi jika artikel nya di klik , jadi ga bisa di baca alias ilang, mohon pencerahan nya gan, http://dinasti-kadam.blogspot.com/

    terima kasih sebelum nya....

    ReplyDelete
  9. Melinda :)July 14, 2012 at 1:13 AM

    sangaaat membantu :)
    terimakasih banyak :D

    mampir ke blog aku ya

    ReplyDelete
  10. miminoemiAugust 24, 2012 at 10:09 AM

    Trima kasih yah... mampir ke blog aku juga..:)

    ReplyDelete
  11. Tips sederhana BlogspotSeptember 9, 2012 at 2:57 PM

    Tipsnya sangat bermanfaat, salam kenal !

    ReplyDelete
  12. blogwidgetSeptember 30, 2012 at 7:42 PM

    ada tips widget baru nich... Cobain ya sob.. Makasih...

    ReplyDelete
  13. Uem CutersNovember 6, 2012 at 11:40 AM

    Saya coba terapkan gan, trims ya. Ditunggu kunjungannya...

    ReplyDelete
  14. UnknownNovember 20, 2012 at 11:47 PM

    terima kasih banyak nih sangat membantu artikelnya, ijin copas ya ilmunya..hhihi

    ReplyDelete
  15. http://medialangka.blogspot.com/January 29, 2013 at 1:38 PM

    wah membantu bangget gan

    ReplyDelete
  16. INFOUNIK-PINTARNovember 14, 2013 at 4:07 PM

    saya terapkan dulu ke blog saya, btw nice share mampir dan komen juga di blog saya tq

    ReplyDelete
  17. musicenvNovember 26, 2013 at 1:48 PM

    terima kasih kk atas informasinya..

    ReplyDelete
  18. FahriJanuary 2, 2014 at 1:18 PM

    makasihh kawan :)

    ReplyDelete
  19. info-anehduniaJanuary 21, 2015 at 7:47 AM

    berhasil gan , hehe , waktu itu kebingungan saya

    ReplyDelete

Subscribe to: Post Comments (Atom)