Cara Membuat dan Memodifikasi Pesan Peringatan di Komentar Blog

PelangiBlog.Com - Dalam dunia blog, Anda tentu menemui banyak spammer komentar. Ya, mereka memang sangat menjengkelkan, berkomentar lepas dari topik posting dan menyertakan link. Saya juga sangat sering mendapatkan komentar-komentar seperti itu, dan tanpa basa-basi saya langsung menghapus komentar-komentar tersebut.

Fungsi utama dari pesan peringatan di kolom komentar blog tentu untuk mencegah langkah-langkah yang bersifat spam. Namun, pesan peringatan di kolom komentar blogger terlihat sangat sederhana dan kurang mencolok. Anda pun bisa memodifikasi pesan peringatan tersebut agar terlihat jelas dan senantiasa terbaca setiap kali pengunjung ingin memberikan komentar. Anda bisa melihat gambar pesan peringatan komentar blog berikut ini :

Nah, dari sini saya memberikan tutorial sekaligus cara untuk membuat pesan peringatan di komentar blog. Silahkan simak 2 langkah berikut ini :

Langkah Pertama : Buatlah Pesan Peringatan di Halaman Setting Blogger Anda

1. Login ke akun blogger Anda

2. Masuk Dashboard

3. Klik “Setelan”, lalu klik “Pos dan komentar”

4. Silahkan Anda mengisi pesan peringatan dengan kalimat Anda pada kolom “Pesan Formulir Komentar”

Langkah Kedua : Memodifikasi Pesan Peringatan di Komentar Blog

1. Klik “Template”, lalu klik “Edit HTML”

2. Cari kode di bawah ini (gunakan CTRL + F agar lebih mudah pencarian) : 

<p><data:blogCommentMessage/></p>

Catatan :

Jika sudah ketemu, biasanya kodenya akan berbentuk seperti di bawah ini :

<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>

Anda akan menemui sekitar 4 kode yang sama seperti kode di atas. Silahkan pilih kode yang kedua dan keempat

3. Tambahkan kode di bawah ini (Ingat, tambahkan pada kode yang kedua dan keempat)

<div id='threaded-comment-form'>
----- tempat untuk kode warna merah di atas -----
</div>

Catatan :

Jika Anda sudah menambahkannya, maka kode akan berbentuk seperti di bawah ini :

<div id='threaded-comment-form'>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
</div>

4. Setelah itu, cari kode di bawah ini :

document.getElementById(domId).insertBefore(replybox, null);

5. Silahkan Anda mengganti kode di atas dengan kode di bawah ini :

document.getElementById(domId).insertBefore(document.getElementById('threaded-comment-form'), null);

Catatan :

Kode ini berfungsi untuk tetap menampilkan pesan peringatan di atas kolom komentar meskipun sudah banyak komentar di bawahnya

6. Cari lagi kode di bawah ini :

]]></b:skin>

7. Letakkan kode di bawah ini tepat berada di atas kode ]]></b:skin> :

/*-- Modifikasi Pesan Peringatan di Komentar Blog--*/
#threaded-comment-form p {
    position: relative;
    background: #4085b8;
    border: 3px solid #5899c9;
    padding: 10px;
    font-size: 11px;
    line-height: 1.6em;
    color: #fff;
    margin-top: 10px;
    font-size: 12px;border-radius:2px;
    }
#threaded-comment-form p::after, #threaded-comment-form p::before {
    top: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none
    }
#threaded-comment-form p::before {
    border-top-color: #5899c9;
    border-width: 15px;
    left: 10%;
    margin-left: -35px;
    }
#threaded-comment-form p::after {
    border-top-color: #4085b8;
    border-width: 10px;
    left: 10%;
    margin-left: -30px
    }

Catatan :
Kode ini berfungsi untuk memodifikasi pesan peringatan

8. Simpan template, Anda bisa melihat demo hasil seperti pada gambar di atas.