Cara Membuat Contact Form pada Static Pages Blogger


Bagaimana cara membuat contact form pada static pages blogger?

Cara membuatnya sebenarnya cukup mudah, tetapi sebelumnya kita harus tau tujuan membuat halaman kontak yang sering disebut juga sebagai halaman contact us atau hubungi saya. Contact form merupakan bagian terpenting dari blog kita yang fungsinya sebagai media korenspondensi formal dan personal, halaman kontak menjadi pilihan karena menjaga privacy antara pemilik dengan pengunjung blog.

Apakah Static Pages itu?

Static pages atau halaman statis adalah halaman yang sifatnya berdiri sendiri dan tidak termasuk dalam history postingan, sehingga tidak masuk pada arsip blog ataupun widget artikel lainnya. Static pages sangat cocok digunakan untuk informasi yang terkait dengan blog misalnya halaman about, contact us, disclaimer, privacy policy dan sitemap karena mudah dibaca oleh pengunjung blog kita. 

Langkah-langkah membuat halaman kontak kami pada static pages blogger antara lain memasang widget Contact Form, menghapus baris kode Contact Form pada halaman editor html, dan memasang Contact Form pada halaman statis. Tutorial lengkap silahkan buka link video tutorial dibawah ini.





Cara Menambah gadget Contact Form
1. Login ke blogger.com => dashboard => klik layout
2. Klik add a gadget => klik Gadget Contact Form (lihat gambar berikut)
Cara Menambah gadget Contact Form pada Blogger
Cara Membuat Contact Form pada Static Pages Blogger
3. Simpan

Cara Menghapus baris kode Contact Form
1. Masuk ke dashboard => klik template => klik edit html
2. Cari kode contactform1 => tampilkan semua kodenya
3. Hapus kode antara <b:includable id='main'> dan </b:includable> (lihat gambar berikut)
Cara menghapus kode contact form pada HTML Editor
Cara menghapus kode Contact Form pada HTML Editor
4. Klik tombol save template

Cara membuat contact form pada halaman statis
1. Pada halaman dashboard => klik pages => klik new page => blank page
2. Setelah masuk halaman post editor, isi judul halaman Contact Us
3. Klik mode "HTML" dan copy paste kode berikut
<style>
.post-title.entry-title{
display: none;
}
</style>
<div dir="ltr" style="text-align: left;" trbidi="on">
<h3 style="text-align: center;">
<b>Kontak Kami</b></h3>
<div style="text-align: center;">
</div>
</div>
<div class='widget ContactForm' id='ContactForm1'>
  <div class='contact-form-widget'>
    <div class='form'>
      <form name='contact-form'>
        </br>Name*</br>
        <input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' type='text' value=''/>
        </br>E-mail*</br>
        <input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' type='text' value=''/>
        </br>Message*</br>
        <textarea class='contact-form-email-message' cols='25' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
        <input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Submit'/>
        <p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
        <p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
      </form>
    </div>
  </div>
</div>
4. Simpan halaman dan jangan pernah klik tombol compose agar hasilnya sesuai keinginan

Silahkan dicoba dengan mengirimkan pesan pada halaman contact us tersebut apakah berhasil atau tidak, setelah berhasil terkirim maka tutorial cara membuat contact form pada static pages blogger ini berhasil sobat ikuti dengan baik. Silahkan tinggalkan komentar pada kolom dibawah ini jika sobat berkenan.

1 Response to "Cara Membuat Contact Form pada Static Pages Blogger"

  1. terimakasih, sudah ane praktekin dan berhasil, terus cara menghapus "formulir kontak" sari side bar bagaimana? ane coba hapus dari gadget bisa tapi pada halamn staticnya jadi error

    ReplyDelete