Tips mudah membuat kotak scroll pada popular post

Bookmark and Share
hay para sobat setia beginerblog pada kesempatan kali ini saya ingin berbagi tips and trick cara membuat scrol pada tampilan popular post...,karena selain bisa membuat tampilan lebih rapi ,widget ini juga penting bagi kerapian blog sobat langsung saja saya akan menjelaskan cara pembuatnya :
Ada dua cara untuk membuat atau memasang scroll box pada widget popular posts blogger plugins.

  1. Menggunakan kode CSS
  2. Menggunakan kode html di bagian body.
Ke dua cara di atas menghasilkan fungsi yang sama, hanya cara yang digunakan berbeda. Jika kita gunakan kode CSS maka kode bisa kita simpan dalam template melalui add a gadget atau disimpan di atas kode ]]></b:skin>, sedangkan untuk xHTML kita harus menyimpan di antara tag pembuka body (<body>) dan tag penutup </body> melalui halaman "Edit HTML".
D E M O
Bentuk Scroll Box Widget Popular Posts Blogger Plugins dapat sampeyan lihat dengan membuka link demo di bawah ini.

D E M O

Cara membuat Scroll Box Popular Posts dg Kode CSS
  1. Login ke Blogger.
  2. Halaman Dasbor (Dasboard).
  3. Rancangan (Design).
  4. Edit HTML
  5. Backup Template.
  6. Cari kode ]]></b:skin>. Letakkan kode CSS di atas kode tersebut.
  7. Simpan Temlate (Save Template).
  8. Selesai (Finish).
Kode CSS
.popular-posts{
overflow:auto;
height:250px;
}


Cara membuat Scroll Box Popular Posts dg xHTML
  1. Login ke Blogger.
  2. Halaman Dasbor (Dasboard).
  3. Rancangan (Design).
  4. Edit HTML
  5. Klik Expand Widget Template.
  6. Backup Template.
  7. Cari kode <div class='widget-content popular-posts'>.
  8. Ganti kode di atas dengan kode berikut
  9. <div class='widget-content popular-posts' style='height:250px;overflow:auto;'>
  10. Simpan Temlate (Save Template).
  11. Selesai (Finish).
semoga berhasil dan selamat menikmati.,.

CATATAN :
  • apabila ingin mengetahui lebih lanjut mengenai cara unik dan menarik untuk mendesain web silahkan cari di daftar isi yang terletak di sebelah kanan

{ 0 komentar... Views All / Send Comment! }

Poskan Komentar