tips tutorial blog kali ini membahas cara bagaimana Membuat Scroll Pada Komentar, hal ini didasarkan kepada pemikiran atau prediksi bahwa komentar yang masuk semakin lama akan semakin bertambah banyak .. duh narsisnya.. sehingga halaman blog akan panjang. Untuk mengatasi ini maka dibuat scrolling pada daftar komentar itu , sehingga blog tidak tampak memanjang ke bawah. Caranya bisa simple bisa juga ribet.. hal ini tergantung pada templatenya. Kalau kodenya sama ya.. gampang.. tapi kalau gak sama.. yaa rasakan sendiri aja deh.. hehehe..
Kalau berminat Membuat Scroll Pada Komentar, langkahnya seperti ini :- Masuk ke Acount blogger anda atau ke Dashboard
- Pilih Layout, kemudian klik Edit HTML
- Cari kode seperti di bawah ini
/* Comments
-------------------------- */
#comments h4 {
margin:1em 0;
font-weight: bold;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color: $sidebarcolor;
}
#comments-block {
margin:1em 0 1.5em;
line-height:1.6em;
}
#comments-block .comment-author {
margin:.5em 0;
}
- Tambahkan kode berikut di atas kode : #comments h4
#comments {
height:400px;
overflow:auto;
}
- Angka 400px : adalah tinggi kotak scroll itu, tinggal diganti sesuai selera kita.
- Jika sudah jangan lupa Save template
Catatan :
Setiap template , kodenya berbeda-beda , seperti di blog Link Tea yang khusus Dofollow saya cukup dibuat bingung juga , setelah 2 jam di utak-atik baru ketemu , we alaa… kodenya malah seperti ini : Coba bandingkan dengan kode di atas , jauh ya…
.navigation{display:block; text-align:center; margin-top:10px; margin-bottom:60px} #comments {Perhatikan yang warna biru itu adalah kode yang ditambahkan untuk fungsi scroll nya. Gimana dengan punya sobat.. beda juga apa tidak ??.
height:400px;
overflow:auto;
} .comments{color:#000; margin:1.5em 0pt 0pt; padding:0pt}
.comments a{color:$linkcolor}
.comments h3{font-size:1.6em}
.commentlist{color:#000; list-style-type:none; margin:1.5em 0pt 0pt; padding:0pt}
.commentlist li{margin-bottom:2em; padding:0.5em 1em}
.alt1{border:1px solid #F2F0E8; padding:0.5em}
.comment-footer a{color:$linkcolor}
Tambahan : Kalau cara diatas masih belum pas , coba yg ini :
- Cari kode seperti dibawah ini :
<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<div class='comments-singleblock'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
- Jika sudah ketemu. tambahkan kode ini tepat diatasnya :
<div style='overflow:auto; width:ancho; height:400px;'>
- Beri penutup tag dari div yaitu tambahkan kode </div> setelah kode </dl>
Masih dalam soal scroll saya telah posting juga tentang : Membuat Fungsi Scroll pada Label / Kategori dan Membuat Scroll pada Archive Blog
Nah begitu yang saya lakukan dalam Membuat Scroll Pada Komentar , selamat berscroll ria ya….
0 comments:
Post a Comment