Bungcip/Gigih

Sukses Memasang WP Thread Comment

Tulisan ini diilhami oleh masalah yang dihadapi oleh mas hakimtea. Beliau kesulitan untuk memasang plugin WP Thread Comment. Sebenarnya plugin ini sangat mudah untuk dipasang, setelan default-nya rata-rata cocok untuk semua theme. Berikut ini pengalaman saya memasang dalam memasang plugin WP Thread Comment, mohon maaf apabila ada tips yang tidak bisa diterapkan di blog anda .

1. Mengaktifkan Plugin WP Thread Comment

Saya rasa anda semuanya bisa mengerti hal ini, bukan? Cukup tekan tombol “activate” saja .

2. Mencoba Berkomentar

Coba anda tes apakah plugin berkerja dengan baik atau tidak. Setelan default rata-rata cocok untuk kebanyakan theme. Masalah yang mungkin sering terjadi adalah tidak tampilnya tombol untuk mengirim komentar. Hal ini terjadi karena tombol tersebut tidak berada dalam satu tag blok dengan borang/form komentar. Solusinya, anda harus mengubah setelan WP Thread Comment.

3. Mengubah Setelan WP Thread Comment

Sekarang ubah nilai Comment Form ID pada kotak isian dengan id dari tag blok paling luar yang mencakup semua elemen borang/form komentar. Pada blog saya tag blok terluar borang komentar bernilai “comment-box”.

1
2
3

<!-- Start Comments Form-->
<h3 id="respond" style="color:#000; letter-spacing: -1px;">Tinggalkan Komentar</h3>
<div id="comment-box" class="Form"></div>

Apabila blok terluar dari theme anda tidak memiliki attribut id, anda bisa menambahkannya sendiri dengan nama yang unik (HTML tidak memperbolehkan adanya dua tag yang memiliki id sama). Umumnya baris diatas bisa ditemui di berkas comments.php.
Seharusnya sampai tahap ini WP Thread Comment sudah berfungsi dengan benar. Anda hanya perlu melangkah ke tahap 4 apabila tampilan borang menjadi berantakan atau tombol tidak tampil dengan benar. Saya juga harus sampai melangkah ke tahap 4 karena tampilan tidak sesuai dengan keinginan saya .

4. Mengubah CSS
Sesuai dengan namanya, style CSS ( Saya rasa singkatanya adalah Cascade Style Sheet) akan meng-overide style dari class/tag diatasnya (mohon maaf karena saya tidak bisa menjelaskan istilah ini dengan benar , silakan baca buku tentang CSS untuk lebih mengenal karakteristiknya). Nah, coba anda perhatikan style komentar seperti:

1
2
3
4
5
6
7
8
9
10
11
12

.Comments .Form {}
.Comments .Form h3 { font-size: 14px; letter-spacing: -1px; background:url(images/CommentsFormHeading.png) no-repeat left center; border-bottom: dashed 1px #87909e; padding: 5px 0px 5px 20px; margin: 0px 0px 10px 0px;}
 
.Comments .Form form { padding: 20px; margin: 0px;}
.Comments .Form p { padding: 3px 0px; margin: 0px; font-size: 12px; color:#000033;}
.Comments .Form p label { padding-bottom: 11px; display: block;}
.Comments .Form p label small { font-size: 11px; color: #000033}
 
.Comments .Form .Note {  margin: 5px 0px; width: 390px;}
.Comments .Form .Note small { font-size: 10px;}
.Comments .Form .TextField { background: #fff; border: solid 1px #E7E7E7; padding: 5px; font-size: 11px; margin-right: 20px; color:#40454b;}
.Comments .Form .TextArea { background: #fff; border: solid 1px #E7E7E7; padding: 5px; font-size: 11px; color:#40454b;}

Tampilan kotak komentar akan terlihat benar apabila tag blok tersebut memakai class Form dan berada di dalam blok yang memakai class Comments. Masalahnya apabila anda memindahkan blok tersebut ke tempat lain (dengan javascript) seperti yang dilakukan oleh WP Thread Comment, style tersebut tidak bisa diterapkan karena struktur blok telah berubah.

Sebelum Berpindah:

Setelah Berpindah:

Strukturnya bukan lagi Comments>>Form tetapi berubah menjadi Comment>>List>>Form dan karena tidak ada style yang sesuai akhirnya tampilan kotak komentar menjadi rusak. Solusi paling gampang adalah mengubah semua style komentar dari :

1
2

.Comments .Form {}
.Comments .Form blabla {blabla:0;}

menjadi seperti ini:

1
2

.Form {}
.Form blabla {blaba:0;}

Hal ini manjur untuk kasus saya dan moga-moga juga manjur untuk kasus yang lain he..he.

Semoga artikel ini bermanfaat bagi orang-orang yang mengalami kesulitan memasang WP Thread Comment. Kalau ada bagian yang salah jangan sungkan untuk berkomentar, ya.