Tujuan pembuatan halaman contact form atau formulir kontak bertujuan untuk memudahkan pengunjung blog berkomunikasi secara pribadi ke admin blog.
Pesan pada contact form yang terkirim akan diteruskan ke inbox gmail milik admin blog, dalam hal ini gmail yang digunakan adalah gmail yang digunakan untuk membuat blog.
Sebenarnya blogger telah menyediakan gadget contact form yang di tempatkan pada bagian sidebar blog, namun kebanyakan pemilik blog memilih menyembunyikannya dan memilih untuk membuat halaman contact form sendiri dengan berbagai variasi di halaman statis.
Cara membuat halaman contact form di blogger
I. Menambahkan gadget contact form pada bagian sidebar
Langkah pertama adalah menambahkan gadget contact form pada bagian sidebar atau anda juga dapat meletakkannya dibagian footer blog.1. Pertama anda klik Tata Letak.
2. Berikutnya anda klik Tambahkan Gadget pada layout sidebar.
3. Berikutnya cari dan klik Contact form atau formulir kontak.
4. Simpan.
II. Menyembunyikan gadget contact form pada bagian sidebar
Langkah kedua adalah menyembunyikan gadget contact form, walaupun disembunyikan namun tetap berfungsi, nah fungsi itulah yang nantinya digunakan untuk membuat halaman contact form di halaman statis agar berjalan dengan baik.1. Pertama anda klik Tema, Edit HTML.
2. Copy kode berikut ini.
#ContactForm1 {display:none;}
3. Berikutnya anda letakkan kode tersebut di atas kode ]]></b:skin>atau
4. Klik Tema, Sesuaikan.
5. Berikutnya klik Lanjutan, Tambahkan CSS.
6. Masukkan kode CSS berikut pada kotak yang telah disediakan.
#ContactForm1{display:none;}
7. Simpan.III. Membuat contact form di halaman statis
1. Pertama anda klik Halaman.2. Berikutnya anda klik Tambahkan Baru.
3. Untuk bagian judul, anda beri judul contact form atau contact me atau sesuai dengan kata yang diinginkan.
4. Berikutnya anda beralih ke mode Penulisan HTML.
5. Berikutnya anda masukkan kode berikut ini
<div style="text-align: left;">Terimakasih telah menghubungi kami</div><div style="text-align: center;">
</div>
<div style="color: green; text-align: left;">Silahkan isi form berikut ini</div>
<div class="contact-form-widget">
<div class="form">
<form name="contact-form">
<p></p>
Nama<br />
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />
<p></p>
Email
<span style="font-weight: bolder;">*</span>
<br />
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />
<p></p>Pesan <span style="font-weight: bolder;">*</span>
<br />
<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>
<p></p>
<input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="kirim" /><br /><p></p>
<div style="max-width: 222px; text-align: center; width: 100%;">
<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>
</div>
</form>
</div>
</div>
Untuk kata-kata dapat anda rubah sendiri.6.Terakhir, anda klik Publikasikan halaman tersebut.
Untuk melihat hasilnya, silahkan anda kunjungi halaman contact form yang telah berhasil anda publikasikan. Selain membuat contact form anda juga perlu membuat:
Tujuannya adalah agar blog terlihat lebih profesional seperti blog-blog yang sudah terkenal, semoga bermanfaat.
Comments
Post a Comment