Nah untuk tutorial kali ini Full Blog Design akan membuat sebuah trik Cara Modifikasi Pesan Formulir Komentar Di Blog .biasanya formulir komentar ini berisi sebuah himbauan untuk pengunjung blog sebelum memberi komentar ,untuk Screenshotnya silahkan lihat gambar di bagian kiri postingan ini.
Untuk cara membuatnya silahkan sobat ikuti cara dan tutorialnya seperti di bawah ini ...secara lengkap tentunya :
- Silahkan Cari kode ]]></b:skin> atau </style>(khusus buat template yang sudah di validkan Css3) pasang kode css di bawah ini tepat di atas kode ]]></b:skin> berikut kodenya:
#pesan-formulir {
background:#ccc url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfXafnlxEXT088hrDRIsMrfGsI8iwoLIgMdEeR7qjpBY20CS2FgqEqe8zz4TugavcOBHl3h1_s_1NknTazeNF7XPo9P0rA3uq-OFtN8HvTPOgcHHycuRPCszVRpxc3XadiMgxtKf4nj-c/s1600/admin.png)no-repeat bottom right;
border: 3px solid #000000;
border-radius: 10px 10px 10px 10px;
box-shadow: 0 0 0 2px #000000, 2px 1px 6px 4px rgba(10, 10, 0, 0.5);
font: 12px/1.3em trebuchet ms;
margin: 10px 10px 10px 0;
padding: 10px;color:blue;
position: relative;
text-align: justify;
width: 96%;
}
#pesan-formulir:after,#pesan-formulir:before {
top: 100%;
border: solid transparent;
content:" ";
height: 0;
width: 0;
position: absolute;
}
#pesan-formulir:before {
border-top-color: #000000;
border-width: 15px;
left: 10%;
margin-left: -36px;
}
#pesan-formulir:after {
border-top-color: #ccc;
border-width: 9px;
left: 10%;
margin-left: -30px
} - Ganti kode berwarna hijau dengan Url gambar sobat sendiri tentunya
- Selanjutnya cari kode <data:blogCommentMessage/> biasanya kode ini di apit oleh tag <p> dan </p> atau kode lengkapnya seperti ini <p><data:blogCommentMessage/></p> biasanya kode ini ada lebih dari satu hapus semua kode ini dan ganti dengan kode di bawah ini:
<div id='pesan-formulir'><p><data:blogCommentMessage/></p></div>
- Dan yang terakhir Save Template
Judul Artikel :Cara Modifikasi Pesan Formulir Komentar Di Blog
35 komentar
Mas coba baca di sini http://blog.kangismet.net/2013/06/blogger-custom-domain-tidak-bisa-diakses.html
Berarti masalahnya ada di modem ya mas ..saya yakin itu ..
Iya mas jaringan speedy sedang bermasalah... sudah lama sekita 2 bulanan ini...apakah mas Mahfid juga merasakan adanya penurunan pengunjung akhir2 ini?
Blog dengan custom domain saat ini tidak bisa diakses dari warnet atau rumah yg menggunkan speedy kecuali sudah ada cache-nya untuk blog tsb.
Coba masuk ke sini mas http://forum-diskusi-blogger.blogspot.com/ pada katagori UMUM...kita ngobrol sama kang Ismet yg menggunakan custom domain juga.
ini kan pernah saya bahas kemarin mas di website nya mas kompi yang tentang Histats mungkin masalahnya ada di speedy
Maaf saya jadi lupa ngomentari artikel ini heheheh...btw modifikasinya keren...ada tanda tangan adminnya...patut dicoba nih...
sebenarnya ini trik kang ismet mas tapi saat saya terapin pada beberap blog saya kok gak berhasil frame kebungkus semua ama form komentarnya tapi setelah saya pake trik ini kok malah berhasil apa karena beda template ya
Ada masukan dikit mas, agar bayangan di kotak komentarnya sempurna (tidak terpotong) coba pada kode
.commentsdikasihpadding-right:10pxbegitu jg dengan postingan kasih padding-left pada main-wrapper.Dan saya lihat ketika saya komen pertama saya tidk melihat tombol konversi kodenya, coba css komentarnya pindahkan ke atas skin mas (satuin sama css lainnya).
Maaf pada main-wrapper juga padding-right
saya kemarin nyoba yang model beginian mas gagal, saya coba dulu yang ini mas..
sudah berhasil mas tapi dibawah, setelah mencoba memperbaiki dengan melalui link diatas malah hilang mas, gimana ya?
Turut menyimak dulu gan. Ini sering saya lakukan di Mas Kolis dan Mas Kompi, kemudian di Mas Mahfid deh, ketiga Guru Besar Blogger untuk saya. Siswa baru.
Lam kenal semuanya. yang suka nongkrong di kafe mas Mahfid ini.
yang hilang apa nya saya lihat sudah jadi tinggal koreksi dikit aja pada bagian #pesan-formulir:after,#pesan-formulir:before { ganti dengan yang ini saja
#pesan-formulir:after,#pesan-formulir:before {
top: 100%;
border: solid transparent;
content:" ";
height: 0;
width: 0;
position: absolute;
}
monggo mas tapi jangan bilang guru dong...kita semua bisa karena saling berbagi masih banyaaak kekurangan yang kita miliki jadi solusinya kita bisa saling bertanya untuk mencari jawaban yang terbaik...
sudah saya ganti beda content itu aja kan? kayaknya nggak ada perubahan setelah dihanti mas...
iya sekarang sudah jadi, tapi kalau sebelum komen berada dibawah kotak mas tapi kalau udah komentar pindah diatas kotak komentar...
jika lihat disini sebelum atau sesudah komen tetep berada di atas kotak ya...
kode content dengan 2 tanda petik di atas (
content:" ";) biasanya terdapat pada kode before atau after mas agus itu yang membuat effect khusus untuk memunculkan tanda segitiga yang ada di bagian bawah kotak ,contoh milk saya di bawah tombol konversi kodesangat menarik sekali sob, tampil beda, heeee
http://omsambudy.blogspot.com/search/label/online%20business
mas setelah saya coba sekarang formulir komentar berada diatas kotak komentar semua, itu setelah saya mengikuti cara link yang mas berikan diatas tentang formulir jatuh kebawah..
tapi setelah dicoba memang berada diatas semua, tapi kok background bergambarnya tidak muncul ya mas, jadi tampak formulir biasa, apanya kira2 itu mas?
seharus nya lakukan secara berurutan dan yang petama di lakukan adalah http://www.fullblogdesign.com/2013/03/pasang-formulir-komentar-di-atas-kotak.html
baru yang kedua trik di atas tentang cara modifikasi formulir
kode css nya mas agus kyaknya masih ada sekarang tinggal edit pada bagian ini
ganti dengan kode inibhahaha... sudah berhasil mas, iya harusnya memang berurutan dulu...
terima kasih banyak mas mahfid...
Mantap bang ini yg saya cari2 selama ini, sy sudah terapkan di blog sy yg acak2an
wach jadi terlihat lebih keren mas terima kasih infonya mas...
wah, succes nih mas..
makasih ya tutornya tentang cara modifikasi pesan formulir.. ^_^
-keep blogging-
Perlu di coba.. di blog kang ismet Ga bisa.. coba kalo yang ini
saya juga mengalami, tp setelah pake DNS Google baik lg...g tau deh yg lain
alhamdulillah,..trimakasih mas
mantep gannn ! berhasil
Mas kalau mengubah warna teksnya gimana ?
edit bagian ini
#pesan-formulir{color:bla bla..}
saya sudah edit disitu Mas, tapi cuma untuk backgroundnya. Untuk warna teksnya nggak ada atuh Mas.
tinggal di tambah aja mas color:bla bla atau pekei yang ini mas
)no-repeat bottom right;
#pesan-formulir {
background:#ccc url(
border: 3px solid #000000;
border-radius: 10px 10px 10px 10px;
box-shadow: 0 0 0 2px #000000, 2px 1px 6px 4px rgba(10, 10, 0, 0.5);
font: 12px/1.3em trebuchet ms;
margin: 10px 10px 10px 0;
padding: 10px;
position: relative;
text-align: justify;
width: 96%;color:red
}
nah pada bagian color:red ganti sesuai keinginan
Salam kenal Mas,. izin simak artikel nya..
Menarik terapin di blog saya Mas
Kunjungi lagi blog saya di Karrysta - Blog Berbagi
http://karristaent.blogspot.com/
saya jadi tertarik dengan tanda tangan adminnya mas. saya mau coba buat.. terima kasih mas.. :)
nice
Posting Komentar
Terima Kasih Sobat Sudah:
1. Berkomentar Dengan Sopan
2. Tidak Memasukkan Link Aktif Dalam Form Komentar
3. Berkomentar Sesuai Artikel/Postingan
4. Berilah Informasi Kepada Admin Jika ada script yang Sudah tidak berfungsi
5. komentar Jorok/kasar /berbau Sara/Porno /saya anggap sebagai SPAM
6.untuk memasukkan gambar gunakan <i rel="image">URL Gambar</i>