Breaking News
Loading...
Kamis, 02 Mei 2013

Modifikasi kotak pesan komentar blog

Kamis, Mei 02, 2013
hallo sobat bloggers,apa kabar ? apakah sehat atau sakit? kalo sehat ya alhamdulillah.oh iya sobat bloggers kali ini blog Tutorialz Ku akan berbagi cara modifikasi kotak pesan komentar blog.yg demonya bisa di lihat di blog ini atau gambar di samping(tapi bagusan gambar disamping dibandingkan demo blog saya).Ya walau pun kode CSSnya dapet dari blog lain yang penting saya bisa berbagi,karena ini kesempatan saya untuk ngepos karena hari senin tanggal 6 mei saya melaksanakan UN (ujian negara),karena saya masih kelas 6.Oke langsung aja ke TKP.

1. logginn ke blogger.com

2. pilih blog yg mau kamu edit kotak pesannya

3. Klik template
4. Klik Edit html (tampilan edit html baru tidak tau cara edit nya kilk disini)

5. cari kode ]]></b:skin> (ctrl + f) dan masukan kode berikut di atas kode tadi

#pra-comment{
position: relative; 
background:#FFFFFF;/* Warna background kotak */
width:100%;
padding:10px; 
font:normal 12px trebuchet ms; 
text-align:justify; 
border:3px solid #FE80DF;/* Warna border kotak */
   border-radius: 10px;
   box-shadow: 0 0 0 2px #000000, 2px 1px 6px 4px rgba(10, 10, 0, 0.5);
margin:0 10px 10px 0; 
margin-top: 10px; 
line-height: 1.3em; 
} 
#pra-comment::after, #pra-comment::before { 
top: 100%; 
border: solid transparent; 
content: " ";
height: 0; 
width: 0; 
position: absolute; 
pointer-events: none 
} 
#pra-comment::before { 
border-top-color: #FE80DF; 
border-width: 15px; 
left: 10%; 
margin-left: -36px 
}
#pra-comment::after { 
border-top-color: #FFFFFF; /* Samakan dengan warna background */
border-width: 9px; 
left: 10%; 
margin-left: -30px
}

6. lalu cari kode <p><data:blogCommentMessage/></p> dan ganti dengan kode berikut :

<div id='pra-comment'><data:blogCommentMessage/></div>

7. simpan template

eiit belom selesai

8. Selanjutnya, masuk ke Setelan - Pos dan Komentar.

9. Pada kolom pesan formulir komentar, masukkan tulisan atau kata-kata mutiara yang ingin ditampilkan

10. Selesai

Keterangan : Ganti kode warna dengan warna-warna yang disukai.

jgn lupa tinggalin komentar ya sob.

4 komentar:

Catatan :
Untuk menyisipkan kode panjang, gunakan tag <i rel="pre">KODE ANDA DI SINI...</i>
Untuk menyisipkan kode, gunakan tag <i rel="code">KODE ANDA DI SINI...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR ANDA DI SINI...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL ANDA DI SINI...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">CATATAN ANDA DI SINI...</b>
Untuk menciptakan efek tebal gunakan tag <b>TEKS ANDA DI SINI...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>TEKS ANDA DI SINI...</i>

Khusus untuk membalas komentar disarankan menggunakan tombol balas di bawah komentar terkait dibandingkan menggunakan formulir komentar di bawah agar komunikasi lebih terstruktur.

Link aktif akan dimatikan secara otomatis.

NB: Jika ingin menuliskan kode pada komentar harap gunakan Tool untuk mengkonversi kode tersebut agar kode bisa muncul dan jelas atau gunakan tool dibawah "Konversi Kode di Sini!".

Jika ingin menuliskan komentar yang keluar dari topik pada artikel ini silahkan kehalaman OOT (out of topic) dengan menekan tombol OOT di bawah

 
Toggle Footer