Ini Dia Cara Mudah Membuat Halaman Kontak di Blog

Cara memasang contact form di blog sebenarnya sangat mudah karena sudah banyak sekali artikel yang membahas bagaimana cara membuat halaman kontak di blog. Halaman kontak adalah salah satu syarat wajib sebuah blog atau website. Dengan adanya halaman kontak para pembaca dapat menyampaikan apa yang menjadi uneg-uneg mereka.

Terutama bagi blog atau website yang digunakan untuk monetisasi seperti iklan google adsense, toko online, blog jualan dan sejenisnya. Dengan adanya contact form ketika ada pihak-pihak yang merasa dirugikan atau ingin menjalin kerja sama maka pihak terkait bisa menghubungi admin blog melalui halaman kontak.

Saat ini blogger telah menyediakan contact form instan melalui widget yang dapat digunakan oleh para pembaca dengan cara mengirimkan email secara otomatis kepada admin sebuah blog. Dengan widget contact form tersebut siapapun bisa mengirim pesan secara langsung tanpa harus login melalui akun email yang dimiliki.

Baca juga: Kelebihan dan Kekurangan Membangun Blog Menggunakan Blogger

Langkah-langkah Membuat Contact Form Melaui Widget Blog

1. Silahkan masuk ke akun blogger anda
2. Pilih Tata Letak >> Pilih Tambahkan Widget



3. Pilih Gadget Lainya
4. Pilih Contact Form

5. Pilih Simpan

Cara Memodifikasi Widget Contact Form Agar Tampil di Halaman Kontak

Yang menjadi masalah adalah widget contact form secara default hanya bisa dipasang dibagian widget saja tidak bisa tampil di halaman kontak. Untuk bisa menampilkan contact form dengan sempurna di halaman kontak maka harus di modifikasi terlebih dahulu. Berikut cara menampilkan contact form di halaman kontak:

1. Masuk ke Tema >> Edit HTML
2. Cari kode di bawah ini dengan cara menekan Ctrl+F:

<b:widget id='ContactForm1' locked='false' title='Formulir Kontak' type='ContactForm'>

3. Silahkan bentangkan dan HAPUS kode dibawah ini yang tepat berada dibawah kode widget contact form diatas:

<b:if cond='data:title != &quot;&quot;'>    <h2 class='title'><data:title/></h2>  </b:if>  <div class='contact-form-widget'>    <div class='form'>      <form name='contact-form'>        <p/>        <data:contactFormNameMsg/>        <br/>        <input class='contact-form-name' expr:id='data:widget.instanceId + &quot;_contact-form-name&quot;' name='name' size='30' type='text' value=''/>        <p/>        <data:contactFormEmailMsg/> <span style='font-weight: bolder;'>*</span>        <br/>        <input class='contact-form-email' expr:id='data:widget.instanceId + &quot;_contact-form-email&quot;' name='email' size='30' type='text' value=''/>        <p/>        <data:contactFormMessageMsg/> <span style='font-weight: bolder;'>*</span>        <br/>        <textarea class='contact-form-email-message' cols='25' expr:id='data:widget.instanceId + &quot;_contact-form-email-message&quot;' name='email-message' rows='5'/>        <p/>        <input class='contact-form-button contact-form-button-submit' expr:id='data:widget.instanceId + &quot;_contact-form-submit&quot;' expr:value='data:contactFormSendMsg' type='button'/>        <p/>        <div style='text-align: center; max-width: 222px; width: 100%'>          <p class='contact-form-error-message' expr:id='data:widget.instanceId + &quot;_contact-form-error-message&quot;'/>          <p class='contact-form-success-message' expr:id='data:widget.instanceId + &quot;_contact-form-success-message&quot;'/>        </div>      </form>    </div>  </div>

4. Jika sudah terhapus silahkan Klik Simpan
5. Pasang kode dibawah ini di halaman kontak blog sobat. Pilih mode HTML

<table><tbody><tr><td>Nama</td> <td><input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="60" type="text" value="" /></td></tr><tr> <td>Email<span style="font-weight: bolder;"> *wajib diisi </span></td><td><input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="60" type="text" value="" /></td></tr><tr> <td>Pesan<span style="font-weight: bolder;"> *wajib diisi </span></td><td><textarea class="contact-form-email-message" cols="60" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea></td></tr><tr><td align="center" colspan="2"><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Send" /></td></tr><tr><td align="center" colspan="2"><div style="max-width: 222px; text-align: center; width: 100%;"><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></td></tr></tbody></table> 

Setelah sobat pasang kode diatas silahkan publikasikan. Untuk melakukan pengecekan kontak form berfungsi dengan baik atau tidak silahkan lakukan pengetesan dengan cara mengirim pesan di halaman kontak yang telah sobat buat. Pesan secara otomatis akan terkirim di email akun blogger sobat. Jika pesan yang telah sobat buat masuk ke email tersebut maka sobat telah berhasil membuat halaman kontak.

Demikian ulasan mengenai bagaimana cara membuat halaman contact us di blog. Semoga bermanfaat bagi anda yang sedang belajar membuat halaman kontak static di blog. Baca juga artikel terkait: Cara Membuat Privacy Policy di Blog Secara Mudah dan Otomatis

0 Response to "Ini Dia Cara Mudah Membuat Halaman Kontak di Blog"

Posting Komentar

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel