Sunday, May 22, 2016

Cara Membuat Contact Form Di Halaman Statis



Cara Membuat Halaman Form Kontak Di Blogger.- Oke sobat, kita masih di seputaran blog. Kali ini Hobby Klik akan membahas tantang cara membuat halaman form kontak/contact us. Contact us/form kontak sangatlah penting di dalam sebuah blog, kenapa? jawabannya Agar pengunjung bisa dengan cepat menghubungi anda dengan notifikasi yang akan dikirim kepada yang empunya blog. Dan alasan lainnya adalah, Contact us harus dibuat agar bila sobat mau mendaftar google adsense ini adalah salah satu syaratnya.
Oke sobat kita langsung saja ke TKP biar sobat tidak penasaran. Tapi sebelum itu saya mau mengatakan bahwasanya blogger sudah memberikan widget berupa form contact, tapi sayangnya widget ini hanya bisa ditempelkan di layout yang ada. Jadi sobat tidak bisa membuat di halaman statis. Dan disini Hobby Klik akan memberikan tips untuk memodifikasi widget itu agar bisa muncul di halaman statis.

LANGKAH-LANGKAHNYA:

Karena secara default contact form ini hanya bisa digunakan di widget, Kita akan memodifikasi agar bisa menampilkannya di halaman statis.

1. Buka blog sobat.
2. Ke Tata letak>Add gadget>Contact form




Setelah kita menambahkan widget saatnya kita untuk memodifikasi.
1. Masuk ke Halaman>Buat Halaman Baru>Pilih HTML
2. Dan copy kan kode dibawah ini kedalam halaman.


<div class="widget ContactForm" id="ContactForm1"><div class="contact-form-widget"><div class="form"><form name="contact-form"><i class="fa fa-user"></i>Name:<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value=""/><br /><br /><i class="fa fa-envelope-o"></i> E-mail:<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value=""/><br /><br /><i class="fa fa-pencil-square-o"></i> Message:<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea><br/><input class="contact-form-button contact-form-button-submit fa-user" id="ContactForm1_contact-form-submit" type="button" value="Submit"/><br /><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><br /></form>
Dan sobat Publish, lihat apa yang terjadi.

Oia, Sobat bisa belajar menggunakan Bootstrap, Kalau sobat ingin mempercantik tampilan contact form nya. Hobby Klik akan membahas "Cara Menggunakan Bootstrap" di artikel/tips dan trik berikutnya.

Oke sobat, kira-kira seperti itulah tutorial dari Hobby Klik untuk membuat Contact Form/Contact Us di halaman statis.
SEMOGA BERMANFAAT.


TERIMA KASIH

No comments:

Post a Comment