Cara mudah membuat form contact us untuk blog - Seperti judulnya membuat layanan Contact Us untuk Blog itu sangatlah mudah, yang penting kita mau mengerjakannya sesuai tuntunan yang telah ditetapkan. Tuntunan yang di maksud adalah tuntunan blogger dan para blogger yang sudah naik ke derajat master.
Form Contact Us merupakan bagian yang penting dari blog. Hal ini bertujuan untuk memberikan pilihan lain bagi pengunjung blog yang ingin berkomunikasi secara privasi melalui pesan pribadi kepada penulis. Baik mengenai isi blog, permintaan pesan terkait hal-hal yang dimuat di blog dan berbagai macam komunikasi lainnya. Yang jelas, layanan ini untuk memberikan ruang kepada pengguna agar bisa berhubungan dengan admin blog.
Bila kamu suka melakukan blog walking, pasti kamu akan menemukan layanan contact us ini di tiap blog, betul kan?. Banyak istilah yang di pakai oleh para pemilik blog, ada yang menuliskannya sebagai "Hubungi Kami, Kotak Saran, Kontak Kami dan lain sebagainya". Namun intinya adalah untuk memberikan kesempatan kepada pengunjung untuk berhubungan dengan pemilik blog atau pemilik sebuah website.
Jadi, dengan mencantumkan form contact us di blog Kamu, bila ada pengunjung yang tertarik dengan isi konten didalam blog kamu dan ingin menyampaikan pesan yang pribadi maka pengunjung akan merasa nyaman menyampaikannya lewat layanan contact us dari pada menyampaikannya di kolom komentar.
Baca Juga :
Cara-membuat-site-map-keren-di-blogger
Cara-mendaftarkan-blog-ke-google-adsense-langsung-dari-blogger
Oke, langsung saja ke langkah-langkah membuat form cotact us untuk blog Kamu. Silahkan isi dulu kopinya dan ambil dulu cemilannya, biar lebih rileks mengikuti penjelasan saya ini.
- Langkah pertama silahkan kamu masuk ke dashboard blogger kamu
- Kemudian kamu pilih menu Laman
- Di Halaman edit Laman kamu pilih mode HTML jangan compose
- Lalu, Kamu Copast kode berikut ini
<br />
<form id="kontak-arlina" name="contact-form">
<input id="ContactForm1_contact-form-name" name="name" placeholder="Name *" size="30" type="text" value="" />
<input id="ContactForm1_contact-form-email" name="email" placeholder="Email *" size="30" type="text" value="" />
<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="Message *" rows="5"></textarea>
<input id="ContactForm1_contact-form-submit" type="button" value="Send Message" />
<br />
<div style="max-width: 222px; text-align: center; width: 100%;">
<div id="ContactForm1_contact-form-error-message">
</div>
<div id="ContactForm1_contact-form-success-message">
</div>
</div>
</form>
<style scoped="" type="text/css">
#comments,.post_meta,#blog-pager{display:none}
form{color:#666}
#kontak-arlina{margin:auto;max-width:640px}
#ContactForm1_contact-form-name,#ContactForm1_contact-form-email{height:auto;margin:5px auto;padding:15px 12px;background:#fff;color:#444;border:1px solid rgba(0,0,0,.14);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);border-radius:3px;width:100%;min-width:100%;transition:all 0.5s ease-out}
#ContactForm1_contact-form-email-message{width:100%;height:175px;margin:5px 0;padding:15px 12px;background:#fff;color:#444;border:1px solid rgba(0,0,0,.14);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);border-radius:3px;resize:none;transition:all 0.5s ease-out}
#ContactForm1_contact-form-name:focus,#ContactForm1_contact-form-email:focus,#ContactForm1_contact-form-email-message:focus{outline:none;background:#fff;color:#444;border-color:#66afe9;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,0.6)}
#ContactForm1_contact-form-submit{float:left;background:#95a5a6;margin:auto;vertical-align:middle;cursor:pointer;padding:12px 20px;font-size:14px;text-align:center;letter-spacing:.5px;border:0;width:100%;max-width:140px;border-radius:3px;color:#fff;font-weight:500;transition:all .8s ease}
#ContactForm1_contact-form-submit:hover{background:#e74c3c;color:#fff;}
#ContactForm1_contact-form-error-message,#ContactForm1_contact-form-success-message{width:100%;margin-top:35px}
.contact-form-error-message-with-border{background:#f6f6f6;border:none;box-shadow:none;color:#444;padding:5px 0}
.contact-form-success-message{background:#4fc3f7;border:none;box-shadow:none;color:#fff}
img.contact-form-cross{line-height:40px;margin-left:5px}
.post-body input{width:initial}
@media only screen and (max-width:640px){
#ContactForm1_contact-form-name, #ContactForm1_contact-form-email,#ContactForm1_contact-form-submit{width:100%;}}
</style>
Setelah itu Klik Publikasikan dan lihat hasilnya. Ehh Jangan lupa ngisi judulnya ya.
Oke... sekarang kamu telah berhasil membuat contact us. Semoga apa yang saya sampaikan ini semakin bermanfaat untuk kita semua.
O iya, ilmu membuat contact us ini hasil ijazah dari sang master blogger Indonesia yaitu mbak Arlina.
Terima kasih.
Posting Komentar untuk "Cara Mudah Membuat Form Contact Us Untuk Blog"
Jangan sungkan untuk berkomentar, karena komentar Anda sangat berharga untuk semua orang. Orang terhebat itu yang mau berbagi gagasan dengan orang semua orang.