Cara Membuat Scroll di Blog

Cara membuat Scroll di blog untuk widget seperti Arsip Blog, populer posts, kategori/label, artikel terbaru dan lain-lain. Scroll berfungsi untuk mempersingkat tampilan dan juga menghemat tempat. Scroll juga membuat halaman blog menjadi lebih cepat untuk dibuka. Untuk lebih jelasnya silakan lihat gambar dibawah ini.
cara membuat scroll di blog
Dari gambar diatas, judul artikel yang terlihat hanya sebatas 4 judul dengan gambar, tapi ketika di scroll menggunakan mouse, maka akan terlihat artikel lainnya, dengan posisi dan tempat yang sama. Sehingga tidak memakan tempat yang banyak. Untuk cara membuatnya. Ikuti langkah-langkah dibawah ini.

Cara Membuat Scroll di Blog

1. Login ke Blogger
2. Dari halaman dasbor Pilih pengaturan Template.
3. Selanjutnya Klik Edit Html.
4. Dan Cari tulisan widget yang akan kita beri scroll. Misalnya widget dengan judul Populer Posts maka kita cari populer posts. Untuk memudahkan pencarian Tekan control F di keyboard dan masukan tulisan Populer Posts .
5. Jika sudah ketemu maka kode lengkapnya seperti dibawah ini.

<b:widget id='PopularPosts1' locked='false' title='Populer Posts' type='PopularPosts'>

6. Sekarang Copy PopularPosts1 ke Notepad dan tambahkan kode lengkap seperti dibawah ini di Notepad.
#PopularPosts1 .widget-content{
height:200px;
width:auto;
overflow:auto;
}
7. Selanjutnya cari kode ]]></b:skin>
8. Copy Kode diatas dan letakkan di Atas kode ]]></b:skin>
Contoh:

#PopularPosts1 .widget-content{
height:200px;
width:auto;
overflow:auto;
}
]]></b:skin>

Catatan: height:200px itu tinggi kotak scroll nya, silakan diganti jika kurang panjang. misalnya jadi height:400px; 

9. Terakhir Klik Preview untuk melihat hasilnya. Jika Populer posts sudah ada scroll nya baru dah di Save. Selesai. Semoga Bermanffat.

Catatan: Jika arsip blog yang ingin diberi sroll. Maka cari dulu tulisan arsip blog di edit html. klo sudah ketemu, copy kode SETELAH tulisan <b:widget id='  terus lanjutkan ke langkah 6 Seperti diatas. Untuk yang lain juga seperti itu caranya. Silakan dicoba.

6 komentar:

  1. ini gimana ya ??
    kok masih pusing.. mohon bantuannya dong.. hehee
    masih awam nie

    BalasHapus
    Balasan
    1. dari halaman dasbor/awal blogger pilih pengaturan template, selanjutnya klik edit html, lalu coba cari kode widget yg ingin diberi fungsu scroll,

      contoh: widget dengan judul entri populer/popular posts. copy kode id nya ke notepad, lalu tambahkan kode2 seperti langkah ke 6, terakhir ikuti langkah sampai selesai.

      Hapus
  2. saya pengen bikin menu kaya di blog anda , jadi bisa buka menu yang dipilih, kaya di blog anda saya bisa ke beranda atau ke desain atau about. nah cara bikinnya bagaimana ya?? tolong ya bantuannya

    BalasHapus
    Balasan
    1. coba lihat di cara membuat menu di blog,,klik di menu desain untuk melihatnya..

      Hapus
  3. cara memasukkan artikel ke menu gimana ya?
    misal, kalo diblog ada. kalo klik desain nanti keluar artikel "cara desain blog sendiri"

    BalasHapus
    Balasan
    1. disini gan http://fandrajuani.blogspot.com/2014/01/cara-mengisi-artikel-di-menu-bar.html baru saja selesai saya buat..

      Hapus

Semoga Artikel diatas dapat membantu anda menemukan, apa yang sedang anda cari. Silahkan tinggalkan komentar.

Kembali Ke Atas
Kembali Ke Atas