Cara Membuat Halaman Kontak Responsive di Blog

Halaman kontak berfungsi untuk memudahkan para pengunjung dalam memberikan kritik maupun pertanyaan.
Membuat Halaman Kontak Responsive di Blog

Ahmiw.com - Bagi pengelola situs atau website pasti sudah tidak asing dengan halaman ini, karena kegunaannya yang dapat memudahkan pengunjung untuk berkomunikasi dengan admin tersebut. Namun, ada beberapa situs yang tidak menerapkan halaman kontak ini, tidak tahu kenapa halaman ini tidak mereka pasang. Sebenarnya sangat berpengaruh sekali dalam berkolabrosi dengan iklan seperti Google AdSense, karena menjadi salah satu syarat mudah untuk diterima oleh pihak adsense.

Halaman kontak berfungsi untuk memudahkan para pengunjung dalam memberikan kritik maupun pertanyaan. Beberapa situs menerapakan ini untuk memberikan kenyamanan untuk pengunjung apabali situs belanja seperti, Shopee, Tokopedia dan sebagainya.

Cukup simpel sekali dalam pembuatan halaman ini, sobat cukup membuat halaman melalui widget yang sudah disediakan oleh blogger, itu juga apabila menggunakan cms tersebut. Untuk lebih jelas dan mudah silahkan simak tutorial berikut.

Cara Membuat Halaman Kontak di Blogger dengan Mudah

  1. Buka dashboard Blogger sobat.
  2. Pilih menu Halaman > Halaman Baru.
  3. Lalu salin script dibawah ini tempat di mode HTML (bukan Compose).
  4. <script>var blogId = '8415962981906694146'; var contactFormMessageSendingMsg ='Mengirim...'; var contactFormMessageSentMsg = 'Pesan sudah dikirim. Semoga Anda bahagia.'; var contactFormMessageNotSentMsg = 'Pesan tidak dapat dikirim. Coba lagi nanti.'; var contactFormEmptyMessageMsg = 'Bidang pesan harus diisi.'; var contactFormInvalidEmailMsg = 'Alamat email harus valid.'  var widgetLoaded=false; function sendEmailMsg() { if(widgetLoaded== false) { _WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'sidebar', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': contactFormMessageSendingMsg , 'contactFormMessageSentMsg': contactFormMessageSentMsg , 'contactFormMessageNotSentMsg': contactFormMessageNotSentMsg , 'contactFormInvalidEmailMsg': contactFormInvalidEmailMsg , 'contactFormEmptyMessageMsg': contactFormEmptyMessageMsg , 'title': 'Contact Form', 'blogId': blogId, 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull')); widgetLoaded=true; document.getElementById('ContactForm1_contact-form-submit').click(); } return true; } </script><b>Perhatian!</b><br />
    <div class="Form">
    <form name="contact-form">
    Harap masukkan email dari akun Gmail Anda yang aktif, karna jika menggunakan email palsu/ yang tidak aktif , maka saya tidak mampu untuk membalas pesan Anda. Atas perhatiannya saya ucapkan terima kasih.<br />
    <br />
    Nama <br />
    <input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" style="max-width: 400px; width: 100%;" type="text" value="" /><br />
    <br />
    Email <span style="font-weight: bolder;">*</span><br />
    <input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" style="max-width: 400px; width: 100%;" type="text" value="" /><br />
    <br />
    Pesan <span style="font-weight: bolder;">*</span><br />
    <textarea class="contact-form-email-message" id="ContactForm1_contact-form-email-message" name="email-message" rows="5" style="max-width: 400px; width: 100%;"></textarea><br />
    <input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" onclick="sendEmailMsg()" type="button" value="Kirim" /><br />
    <div style="max-width: 400px; 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>
    </form>
    </div>
    NB: Jangan lupa berikan judul terlebih dahulu dan rubah kode yang berwarna merah dengan ID Blog sobat.
  5. Terakhir, jangan lupa Simpan.

Itulah Cara Membuat Halaman Kontak Responsive di Blog yang dapat saya bagikan, apabila ada pertanyaan silahkan komen di kolom komentar. Semoga bermanfaat, sekian dan terimakasih.