Home » , , , » Modifikasi Pesan Formulir Komentar dengan CSS

Modifikasi Pesan Formulir Komentar dengan CSS


Jika Anda bosan dengan style bawaan Blogger yang polos itu, silahkan ikuti Cara Mengedit Pesan Komentar dengan CSS dibawah ini :
  1. Masuk Blogger
  2. Pilih Template
  3. Edit HTML ==> Centang Expand Template Widget
  4. Cari kode <p><data:blogCommentMessage/></p> dengan menekan tombol CTRL+F
  5. Setelah ketemu, ganti kode diatas dengan kode ini :
<div id='acep-comment'><data:blogCommentMessage/></div> 
Catatan : Biasanya kode <p><data:blogCommentMessage/></p> ada lebih dari 2, jadi ganti semua kode tersebut biar lebih mantap. Saran saya backup template Anda dahulu agar bisa meminimalisir kesalahan yang tidak diinginkan.
  1. Kemudian cari ]]></b:skin> dengan CTRL+F dan copy kode dibawah ini, dan letakkan tepat diatas ]]></b:skin>
 /*-- Mendekorasi Pesan Formulir Komentar --*/
#amroe-comment{
position: relative;
background:#555; /* Warna Background Utama */
color:#fff;
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;
}
#amroe-comment::after, #amroe-comment::before {
top: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none
}
#amroe-comment::before {
border-top-color: #000000;
border-width: 15px;
left: 10%;
margin-left: -36px
}
#amroe-comment::after {
border-top-color: #555; /* Samakan dengan Warna Background Utama */
border-width: 9px;
left: 10%;
margin-left: -30px
} 
  1. Lalu tambahkan kode ini tepat diatas kode </head>
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'/> 
  1. Kemudian Simpan Template
Gimana, cukup mudah bukan? Demikian postingan kali ini dari saya, bila ada kekurangan mohon kritik dan sarannya semoga bermanfaat bagi para Blogger sekalian. Apabila ada kendala ataupun ada hal yang ingin ditanyakan silahkan berkomentar di kolom komentar dibawah ini. Happy coding...

Dikutip dari : Sumber

3 komentar :

Silahkan tinggalkan komentar Anda dan terimakasih telah berkunjung di amroe-oemar.blogspot.com semoga artikel yang baru saja anda baca bermanfaat untuk Anda. Selamat berblogging...

Total Tayangan Laman

 
Copyright © 2015. Blognya Amroe - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger
Back to top