Cara terbaru membuat Contact diblog

Widget contact form ini memudahkan pengunjung menghubungi admin blogger untuk "kepentingan pribadi" atau "pesan khusus" yang tidak ingin diketahui pengunjung lain.

Dengan adanya halaman khusus Form Kontak ini, maka pengunjung/pembaca tidak mesti mengirimkan pesan via email, cukup di contact form ini. What a User Friendly!

Berikut ini sampingan belajar Blog share cara membuat halaman khusus (halaman statis) formulir kontak sehingga Contact Form tidak muncul di sidebar. Contoh atau demonya bisa dilihat di Halaman Kontak.

Jika ada pengunjung  yang mengisi contact form tersebut, maka pesannya akan masuk ke Inbox Email Gmail kita sebagai admin blog, yaitu email yang digunakan untuk membuat blog. Jika tidak ada di folder email utama (Primary), maka akan masuk di folder "Social".

Cara Membuat Formulir Kontak (Contact Form) di Halaman Statis Blog

Tahap1: Tambahkan Gadget Contact Form

1. Klik Layout > Add a Gadget > Klik More Gadgets > pilih "Contact Form".
2. Klik Save!
3. Seret dan pindahkan posisi widget Contact Form tadi ke bawah elemen "Blog Posts"Contact Form di Halaman Statis Blog
4. Klik Save arrangement!

Tahap2: Sembunyikan Widget "Contact Form"

1. Template > Edit HTML
2. Copas kode berikut ini di atas kode ]]></b:skin>

.widget.ContactForm { display: none; }

Tahap3: Membuat Halaman Kontak

1. Page > New Page
2. Isi judul dengan, misalnya, Kontak
3. Klik mode HTML
4. Copas kode berikut ini di kolom content:
<div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><div style="border: 10px double rgb(204, 204, 204); box-shadow: rgb(0, 0, 0) 0px 0px 15px; padding: 10px; text-align: center; width: 250px;">
<div class="widget ContactForm" id="ContactForm1">
<div class="contact-form-widget">
<div class="form">
<form name="contact-form">
<div style="text-align: center;">
<br />
<b>Name:</b></div>
<div style="text-align: center;">
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />
        </div>
<div style="text-align: center;">
<br />
<b>E-mail *</b></div>
<div style="text-align: center;">
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" /><br />
<br />
<b>Message *</b></div>
<div style="text-align: center;">
<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>
        <br />
<br />
<input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" size="50" type="button" value="Submit" />
        </div>
<div style="text-align: center;">
</div>
<div class="contact-form-error-message" id="ContactForm1_contact-form-error-message">
</div>
<div class="contact-form-success-message" id="ContactForm1_contact-form-success-message">
</div>
<div style="text-align: center;">
</div>
</form>
</div>
</div>
</div>
<div style="text-align: justify;">
<span style="font-size: xx-small;">Desain By: <a href="http://sampinganblognih.blogspot.com/2015/09/cara-terbaru-dan-mudah-membuat-contact.html/" target="_blank">SampinganBlog</a></span></div>
</div>
</td></tr>
</tbody></table>
</div>
5. Klik Publish !

Kini blog Anda sudah punya halaman khusus Kontak berisi Contact Form!