Membuat pesan formulir komentar dengan css

Membuat pesan formulir komentar dengan css

Komentar
Merubah tampilan dan gaya pesan untuk komentar di blogger agar terlihat lebih rapi dan mempunyai style tersendiri bukanlah hal yang sulit. trik ini terkadang berguna untuk membuat pengunjung lebih semangat berkomentar, anda ingin pesan form komentar blog anda bergaya seperti berikut



ikuti panduan berikut ini...

1. Masuk Blogger.
2.Pilih Template
3, Edit HTML => Centang Expand Template Widget
4. Lalu cari kode <p><data:blogCommentMessage/></p> dengan menekan tombol CTRL+F
5. Setelah bertemu, ganti kode diatas dengan kode berikut:
<div id='defandaky-comment'><data:blogCommentMessage/></div>
Catatan: kode <p><data:blogCommentMessage/></p> ada banya, ganti saja semuanya.
6. Kemudian cari ]]></b:skin> dengan CTRL+F dan copy kode dibawah ini, dan letakkan tepat diatas ]]></b:skin>

 /*-- Gaya Pesan Formulir Komentar --*/
#defandaky-comment{
position: relative;
background:#3272c3; /* Warna Background Utama */
color:#000;
width:94%; /* Sesuaikan Lebar dengan Kebutuhan */
padding:10px;
font-family: 'Open Sans', sans-serif;
font-weight:normal;
text-align:justify;
border:3px solid #000;
border-radius: 5px;
margin:0 10px 10px 0;
margin-top: 10px;
line-height: 1.3em;
}
#defandaky-comment::after, #acep-comment::before {
top: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none
}
#defandaky-comment::before {
border-top-color: #000000;
border-width: 15px;
left: 10%;
margin-left: -36px
}
#defandaky-comment::after {
border-top-color: #3272c3; /* Samakan dengan Warna Background Utama */
border-width: 9px;
left: 10%;
margin-left: -30px
}

7. Lalu masukkan kode di bawah ini tepat diatas kode <body> 

<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'/>

8. Kemudian Save Template

Lihat perubahan di pesan komentar blog anda, semoga bermanfaat.

Artikel Terkait

  • Menandai komentar author di Blog
    Sambil menunggu tarawih dari pada bengong saya mau berbagi trik tentang komentar di blogger, dengann trik membedakan kelas komentar ini pengunjung akan lebih mudah tahu mana komentar author dalam blog tersebut sehingga untuk Si pengguna anonim tidak dapat dengan mudah menyamar sebagai author blog dengan tujuan menyesatkan. Memasang trik ini p…
  • Emoticon komentar otomatis
    Emo atau smiley biasanya digunakan untuk menyatakan suasana hati, senang, sedih, marah dsb. Selain itu juga sebagai penambah unik kolom komentar blog, sehingga tampak lebih interaktif dengan pengunjung ketika saling berbalas komentar. Sudah banyak tutorial tentang cara memasang emotikon pada komentar blogger, tapi saya share ini untuk pembaca…
  • Komentar blogger threaded comment
    Sebelum melakukan installasi astikan Backup dulu template, untuk menghindari error pada installasi 1. Masuk ke Blogger 2. Klik Template --> Edit HTML, centang Expand Template Widget 3. Ganti semua kode <b:include data='post' name='threaded_comments'/> dengan <b:include data='post' name='comments'/>  apabila ti…
  • Modifikasi Alert Emoticon
    Saya telah membuat postingan Emoticon komentar otomatis namun pada postingan dahulu itu tidak ada modifikasi pemberitahuan pada saat emoticon tersebut di klik yang mana tampilannya masih menggunakan tampilan alert default. Demo Dan pada postingan saya kali ini saya akan membagikan cara modifikasi tampilan alertnya sesuka hati kita agar t…
  • Memasang komentar Google plus versi dua
    Sudah pasang tapi tidak muncul? ada kesalahan atau template costume bloggernya berbeda. ikutu saja cara berikut ini setelah sobat tidak berhasil menerapkan Cara Memasang Widget Komentar Google Plus di Blogger yang pertama Pertama seperti biasa login ke akun blog sobat. Kemudian klik Template >> Edit Html.(backup dulu sebelum edit agar b…
  • Membuat pesan formulir komentar dengan css
    Merubah tampilan dan gaya pesan untuk komentar di blogger agar terlihat lebih rapi dan mempunyai style tersendiri bukanlah hal yang sulit. trik ini terkadang berguna untuk membuat pengunjung lebih semangat berkomentar, anda ingin pesan form komentar blog anda bergaya seperti berikut ikuti panduan berikut ini... 1. Masuk Blogger. 2.Pilih Tem…

1 komentar

Kode klik emo: :) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p

Link aktif dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan kode, gunakan tag <i rel="code">...KODE ANDA DI SINI...</i>
Untuk menyisipkan script, gunakan <i rel="pre">...KODE SCRIPT ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">...URL GAMBAR ANDA ...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">...JUDUL ANDA...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">...CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <b>...TEKS ANDA...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>...TEKS ANDA...</i>

Konversi KodeOOT
:) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p
Jika anda memiliki bahasan atau topik lain yang sama sekali tidak ada hubungan dengan tutorial diatas anda bisa menyampaikannya di halaman OOt. klik [link ini] untuk membuka halaman OOT.

Back to Top
Loading...