Fungsi Scroll Pada Posting

Nah, saya terinspirasi dari sebuah blog yang kotak postnya terdapat fungsi scroll. Seperti yang kita ketahui, fungsi scroll sangat berguna untuk menghemat tempat. Jika anda masih bingung, silahkan lihat blog percobaan saya dengan membuka 1 post yang terbaru, dikarenakan post itu panjang. Lihat contoh

Penasaran untuk membuatnya? Cara yang terbilang cukup simple ini akan saya bagi kok, tenang aja, haha lol
Oke, Check This Out
1. Login ke blog anda --> Layouts --> Edit HTML
2. Cari kode .post-body { kemudian letakkan kode berikut

  overflow: auto;
  height : 500px;

3. Sesuaikan height (yang bewarna biru) dengan layouts anda, semisal yang ada pada blog percobaan saya.

.post-body {
  margin:0 0 .75em;
  line-height:1.6em;
  overflow: auto;
  height : 500px;
  }

4. Nah, bagimana? Namun, untuk membuat efek scroll beserta h3 (judul post), hanya terdapat perbedaan letak menaruh kode diatas.
Cari kode .post { masukkan kode seperti langkah 2
5. Sehingga menjadi kurang lebih seperti ini

.post {
  margin:.5em 0 1.5em;
  border-bottom:1px dotted $bordercolor;
  border-right: 1px solid $bordercolor;
  padding-bottom:1.5em;
  padding-right: 6px;
  overflow: auto;
  height : 500px;
  }

Next, Save Template!
Nah, bagaimana? Selamat mencoba.. Jangan lupa komentarnya...

Tweet

Artikel Terkait:

Trick Blog

• Trick Blog | Recent Post With Thumbnail Horizontal
• CSS3 | Transform Rotate : Memutar Text / Gambar
• Trick Blog | Berbagai Macam Cursor
• CSS3 | Create Beautiful Button
• CSS3 | Create Bubble Coda Style
• CSS3 | Membuat Background Pada Web Full Page
• Membuat Facebook Fans (Like Box) Pada Blog
• Membuat Background Efek Gradient Dengan CSS3
• Menyembunyikan Avatar Pada Komentar Blog
• Cara Memberikan Image Verification Pada Komentar

Post

• Memasang Random Post (Part 2)
• Recent Post Animated With jQuery
• Membuat Daftar Isi Otomatis
• jQuery Accordion Recent Post with Thumbnail
• Cara Membuat Navigasi Breadcumb Di Blogger
• Cara Membuat Huruf Pertama Besar (Drop Cap Pada Blog)
• Cara Menghilangkan Tanggal Pada Posting
• JavaScript Untuk Menampilkan Total Post, Comment Dan Online User
• Cara Menghilangkan Nomor Post Pada Label