Rabu, 29 Februari 2012

Memberi Scroll Pada Komentar Di Blogger v.3

Baiklah sahabat blogger kali ini kita akan membahas mengenai cara Memberi Scroll Pada Komentar Di Blogger versi ke 3 di mana di versi ini kita akan memberikan atau membuat scroll pada komentar yang memberikan batasan pada panjangnya jumlah komentar sehingga kita tetap menjaga keindahan struktur situs kita dan di versi ke 3 ini kita akan menambahkan fungsi lain yaitu dari pungsi hide show tampilan komentar dimana pada saat awal halaman di load semua komentar do halaman tersebut akan di sembunyikan dan jika kita akan bisa melihatnya setelah kita mengklik tombol Buka, sebenarnya Fungsi ini kita buat dari gabungan membari kotak pada komentar yang telah kita lakukan sebelumnya dan menambahkan fitur spoiler yang akan kita lakukan, dan mungkin Anda yang belum tau sangat penasaran bagai mana hasilnya dan penampilannya, baiklah sebaiknya kita langsung saja mempraktekkannya, mari kita langsung menuju-langkah-langkahnya yaitu sebagai berikut ;

1. Login Ke Blogger
2. Klik Rancangan
3. Klik Edit HTML
4. Centang check box Expand Widgets Template
5. Untuk jaga-jaga bilamana terjadi kegagalan klik Download Template Lengkap
6. Tekan F3/Ctrl+F dan Cari/Ketikan script  seperti di bawah ini

<dl expr:class='data:post.avatarIndentClass' id='comments-block'>

7. Setelah ketemu letakkan kode di bawah ini ke atas Script tadi

<div style='margin: 5px 20px 20px;'>
<div class='smallfont' style='margin-bottom: 2px;'>
<b>Anda mau lihat komentarnya tinggal Klik </b>: <input onclick='if (this.parentNode.parentNode.getElementsByTagName(&apos;div&apos;)[1].getElementsByTagName(&apos;div&apos;)[0].style.display != &apos;&apos;) { this.parentNode.parentNode.getElementsByTagName(&apos;div&apos;)[1].getElementsByTagName(&apos;div&apos;)[0].style.display = &apos;&apos;; this.innerText = &apos;&apos;; this.value = &apos;Close&apos;; } else { this.parentNode.parentNode.getElementsByTagName(&apos;div&apos;)[1].getElementsByTagName(&apos;div&apos;)[0].style.display = &apos;none&apos;; this.innerText = &apos;&apos;; this.value = &apos;Buka&apos;; }' style='font-size: 12px; margin: 0px; padding: 0px; width: 55px;' type='button' value='Buka'/></div>
<div class='alt2' style='border: 1px inset; margin: 0px; padding: 6px;'>
<div style='display: none;'>
<div style='border: 1px solid rgb(204, 204, 204); padding: 5px; overflow: auto; width: 98%; height: 300px; background-color: #;'>


8. Kemudian cari lagi script di bawah ini yang tidak jauh dari sebelumnya
</dl>

9. Lalu letakkan Script di bawah ini ke bawah Script tadi
</div>
</div>
</div>
</div>

8. Simpan Template dan lihat perubahannya

Selamat mencoba, semoga berhasil dan terima kasih telah berkunjung, silahkan berikan komentar Anda mengenai ini.

Tidak ada komentar:

Posting Komentar

Jangan lakukan spam pada komentar dan bila anda ingin beriklan gratis atau hanya sekedar membuat backlink anda bisa melakukannya di beriklanbersama.blogspot.com dan hanya dengan sekali pasang maka akan terpasang di 10 website.