 |
| Cara Membuat Halaman Kontak di Blogger |
Cara Membuat Halaman Kontak, Cara Menambahkan Layanan Contact, Membuat Halaman Kontak di Halama Statis Blogger, Membuat Halaman Kontak di Blogspot, Membuat Contact Form di Blogger,
Cara Membuat Form Contact di Halman Statis Blogger. Halaman Kontak ini bermanfaat untuk mengirim pesan text yang nantinya secara otomatis bakal dikirim ke email si empunya blog. Halaman Kontak ini juga sanggup digunakan untuk mengawal blog anda selalu update dan sanggup digunakan sebagai halaman yang dipindahkan dikala ada link bobrok di blog. Pernah saya kupas sebelumnya mengenai.
Ketika pengunjung menemukan goresan pena yang hilang, maka secara otomatis akan dipindahkan ke halaman Error 404. Nah.. pada halaman error 404 ini kau sanggup mengalihkannya pulang ke halaman kontak. jadi pengunjung sanggup menghubungi admin blog itu dikala goresan pena yang mereka cari tidak sanggup di temukan.
Halaman Kontak ini paling simpel sampai-sampai pengunjung yang hendak menghubungi admin, sanggup pribadi mengirim pesan tanpa mesti membuka akun email terlebih dahulu
Cara Membuat Halaman Kontak
1. Pada halaman utama Blogger, silahkan pilih "Laman" lantas "Laman Baru"
2. Silahkan pilih "HTML" lantas masukan isyarat inilah ini kemudian "Publikasikan"
Silakan isi form di bawah ini untuk menghubungi admin. Jika tidak ada halangan dan kesibukan lainnya, admin akan pribadi merespon pesan yang Anda kirimkan.
<form id="kontak-arlina" name="contact-form">
Name
<input id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />
Email Address <span style="border:1px solid;color:#f14b4b;display:inline-block;font-size:x-small;font-weight:300;line-height:normal;margin:0 0 0 10px;padding:2px 6px;border-radius:2px;vertical-align:middle;">required</span>
<input id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />
Content <span style="border:1px solid;color:#f14b4b;display:inline-block;font-size:x-small;font-weight:500;line-height:normal;margin:0 0 0 10px;padding:2px 6px;border-radius:2px;vertical-align:middle;">required</span>
<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>
<input id="ContactForm1_contact-form-submit" type="button" value="Send Message" />
<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);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);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:rgba(0,0,0,.24);}
#ContactForm1_contact-form-submit{float:left;background:#222;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:#f14b4b;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>
<form id="kontak-arlina" name="contact-form">
Name
<input id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />
Email Address <span style="border:1px solid;color:#f14b4b;display:inline-block;font-size:x-small;font-weight:300;line-height:normal;margin:0 0 0 10px;padding:2px 6px;border-radius:2px;vertical-align:middle;">required</span>
<input id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />
Content <span style="border:1px solid;color:#f14b4b;display:inline-block;font-size:x-small;font-weight:500;line-height:normal;margin:0 0 0 10px;padding:2px 6px;border-radius:2px;vertical-align:middle;">required</span>
<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>
<input id="ContactForm1_contact-form-submit" type="button" value="Send Message" />
<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);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);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:rgba(0,0,0,.24);}
#ContactForm1_contact-form-submit{float:left;background:#222;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:#f14b4b;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>
Agar halaman kontak ini sanggup digunakan, anda wajib memasang widget eksemplar isian kontak di blog kamu. widget atau gadget eksemplar isian kontak ini telah disediakan oleh blogger. Semoga bermanfaat Terimakasih
Advertisement