Cara membuat pesan di atas kolom komentar - atau kotak pesan formulir ini adalah sebuah pesan untuk form komentar, biasanya memang penggunaan pesan formulir di atas komentar ini untuk membuat sebuah pesan, entah itu sebuah peringatan atau kata-kata lain seperti peraturan, sanjungan atau sekedar basa basi menyambut komentator, yang penting hal ini bisa di sampaikan kepada seorang komentator, maka guna pesan formulir adalah seperti itu..
ini adalah contoh yg saya terapkan di kotak komentar postingan ini. '-'.
Pada kesempatan kali ini saya akan berbagi cara membuat kotak pesan formulir atau kotak peraturan komentar kali ini dengan modifikasi yang lebih bagus, karena biasanya jika kita tidak memodifikasinya, tampilannya sangat jelek dan letaknya tersebut kadang di bawah kotak komentar, oke bagi sobat yang ingin menerapkan modifikasi pesan formulir tersebut, langsung saja ikuti tutorialnya :).
2. Pilih menu template > Klik Edit HTML
.
3. Selanjutnya anda cari kode seperti ini .
<p><data:blogCommentMessage/></p>
biasanya kode seperti ini ada 3 atau 4. nah anda cari kode yang no 2 dan 4 saja..
4. Selanjutnya tambahkan kode di atas dengan kode di bawah ini.
.
<div id='threaded-comment-form'>
...kode di atas...
</div>
5. Sehingga penampakan akhirnya akan 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>
Catatan :
Jangan lupa untuk meletakan kode tersebut, hanya pada kode ke 2 dan ke 4..
6. Selanjutnya cari kode seperti dibawah ini.
.
document.getElementById(domId).insertBefore(replybox, null);
7. Lalu ganti kode tersebut dengan kode dibawah ini.
.
document.getElementById(domId).insertBefore(document.getElementById('threaded-comment-form'), null);
8. Lalu letakan kode dibawah ini di atas kode ]]></b:skin> atau </style>
/*-- CSS Pesan Komentar www.pusat-tutorial.com--*/
#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
}
9. Klik save template..
10. Selanjutnya, untuk menambahkan pesan di atas tersebut, silahkan buka pada menu setelan > Pos dan komentar > Tambahkan.
.
