Cara Mudah Membuat Kotak Pesan Teks Diatas Kolom Komentar - Kemarin ada salah satu dari teman blogger yang bertanya pada saya bagaimana cara Membuat Pesan Teks Diatas Komentar, sebenarnya tutorial ini mudah sekali dan sudah banyak juga yang sharing. Namun kali ini saya tuangkan kembali disini, dengan maksud teman blogger yang masih belum mengerti bisa paham dengan tutorial ini.
Untuk memulai membuat pesan teks diatas kolom komentar, silakan sobat ikuti beberapa langkah dibawah dengan benar.
Membuat Pesan Teks Diatas Kolom Komentar
Langkah Ke-1 :
Cari kode <p><data:blogCommentMessage/></p> biasanya kode ini terdapat 4buah, disini kita pilih kode yang ke 2 dan kode ke 4. Kira-kira kodenya seperti dibawah ini
<p><data:blogCommentMessage/></p>
<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='' width='100%'/>Tambahkan kode <p><data:blogCommentMessage/></p> dibawah kode threaded-comment-form yang ada pada kode urutan ke 2 dan 4, lihat dibawah
<div id='threaded-comment-form'>
...kode di atas...
</div>sehingga menjadi seperti dibawah ini
<div id='threaded-comment-form'>
<p><data:blogCommentMessage/></p>
<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='' width='100%'/>
</div>Lakukan langkah yang sama seperti diatas pada kode 4
Langkah Ke-2 :
Cari kode:
document.getElementById(domId).insertBefore(replybox, null)ganti dengan kode :
document.getElementById(domId).insertBefore(document.getElementById('threaded-comment-form'), null);Langkah Ke-3 :
Selanjutnya, untuk mempercantik tampilan kotak pesan tambahkan CSS berikut diatas kode ]]></b:skin>
/*-- Modifikasi Pesan Komentar--*/
#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: 11px;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
}
Kemudian Simpan Template.
Baca Juga : Cara Memunculkan Menu Penghasilan Adsense di Blogger
Kotak pesan teks sudah siap diisi, untuk mengisi pesan teks nya kalian masuk ke Dashbor > Setelan > Post dan Komentar. Klik tambahkan pada Pesan Formulir Komentar. Tulis pesan yang ingin ditampilkan dan jangan lupa untuk disimpan.
Sekian artikel Cara Mudah Membuat Kotak Pesan Teks Diatas Kolom Komentar, semoga bermanfaat.
