Pesan formulir komentar keren dengan css

Posted by : Unknown

kali ini saya akan share cara membuat Pesan Formulir Komentar Keren Dengan CSS.
Mau liat tampilannya, liat gambar dibawah ini aja

Masuk Ke Akun blogger anda
Klik Rancangan / Template
Centang Expand template widget
Cari kode seperti ini :

<b:else/> <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='430' id='comment-editor' name='comment-editor' src='' width='100%'

Ingat : kode berwarna hijau itu biasanya ada 2 ( dua )
Tapi Cukup anda cari kode yang berada di bawah kode <b:else/> seperti di atas ..

Setelah ketemu ganti dengan kode dibawah ini

<b:else/>
<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='430' id='comment-editor' name='comment-editor' src='' width='100%'/>

Setelah itu Simpan kode css di bawah ini di atas kode ]]></b:skin>

#threaded-comment-form p {
position: relative;
background: #DD0;
border: 3px solid #38F;
padding: 10px;
font-size: 13px;
line-height: 1.6em;
color: #000;
margin-top: 30px;
}
#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: #38F;
border-width: 15px;
left: 10%;
margin-left: -36px
}
#threaded-comment-form p::after {
border-top-color: #DD0;
border-width: 9px;
left: 10%;
margin-left: -30px
}

Setelah itu cari kode seperti ini

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

Dan Ganti Kode diatas dengan Kode dibawah ini :

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

Klik SIMPAN TEMPLATE
Silahkan anda isikan pesan formulir komentar anda caranya:

- Masuk ke Setting / setelan
- Lalu klik KOMENTAR
- Lalu scroll ke bawah dan lihat kata Pesan Formulir Komentar
- Nah isi kolom tersebut dengan pesan anda lalu klik SIMPAN SETELAN / Save Setting

Sumber : http://www.kuntoro-cyber.com/