Cara Mengatasi Tombol Reply Error di Blogger

Kali ini saya akan membahas sedikit tentang halaman kontak/contact form pada sebuah website/blog dan cara membuat halaman kontak di blogger.

Halaman kontak/contact form pada sebuah website/blog sangat berguna ketika seseorang hendak menghubungi pemilik website/blog atau orang yang bersangkutan, untuk menanyakan sesuatu atau meberikan sebuah kritik/saran.

Pada halaman kontak biasanya terdapat sebuah form isian yang harus diisi terlebih dahulu, seperti nama, email, pesan. Tidak hanya form saja biasanya juga terdapat sebuah alamat rumah/kantor, no hp/telepon, alamat email dan akun sosial media untuk memudahkan pengunjung website menghubungi pemilik website/blog atau orang yang bersangkutan.

Di sini saya akan menjelaskan bagaimana cara membuat halaman kontak untuk Blogger. Simak caranya di bawah ini.

1. Masuk ke akun blogger kalian, kemudian pilih menu Halaman - Halaman baru.

2. Isi judul halaman dengan, contoh: Kontak, Contact, Contact Us, Contact Me. *Kita tidak dapat merubah permalink, jadi isilah judul yang sesuai supaya permalink yang di hasilkan bagus.

3. Klik HTML, copy dan paste kode di bawah ini pada kolom editor. "000...000" 19 digit yang berwarana merah ganti dengan Blog Id kalian(Blog Id dapat dilihat pada address bar browser), untuk lebih jelasnya bisa lihat gambar.

<form name="contact-form">
  <label for="ContactForm1_contact-form-name">Name</label><br/>
  <input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="40" type="text" value=""><br/>
  <label for="ContactForm1_contact-form-email">Email <span class="required">*</span></label><br/>
  <input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="40" type="text" value=""><br/>
  <label for="ContactForm1_contact-form-email-message">Message <span class="required">*</span></label><br/>
  <textarea class="contact-form-email-message" cols="60" id="ContactForm1_contact-form-email-message" name="email-message" rows="8"></textarea><br/>
  <input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Send"><br/>
  <div class="message-status">
    <span class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></span>
    <span class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></span>
  </div>
</form>

<style type='text/css'>input[type="text"],textarea{border:1px solid #ccc;border-radius:2px;margin-bottom:20px;max-width:100%;}input[type="button"]{background:#448AFF;border:2px solid #448AFF;border-radius:2px;color:#fff;cursor:pointer;font-size:16px;padding:10px 16px;}input[type="button"]:hover{background:#fff;color:#448AFF;}.required{color:red;}.message-status{margin:10px 0;text-align:center;}.contact-form-error-message-with-border,.contact-form-success-message-with-border{border:1px solid transparent;border-radius:2px;display:inline-block;margin:0;padding:5px 10px;}.contact-form-error-message-with-border{background:#f8d7da;border-color:#f5c6cb;color:#721c24;}.contact-form-success-message-with-border{background:#d4edda;border-color:#c3e6cb;}.contact-form-cross{border:0!important;display:inline-block!important;margin:0 0 0 10px!important;}</style>
<script type="text/javascript" src="https://www.blogger.com/static/v1/widgets/1967145202-widgets.js"></script>
<script type='text/javascript'>
var BlogId = '0000000000000000000'; // Blog ID !important

_WidgetManager._Init();
_WidgetManager._RegisterWidget('_ContactFormView',new _WidgetInfo('ContactForm1','right-sidebar',document.getElementById('ContactForm1'),{'contactFormMessageSendingMsg':'Sending...','contactFormMessageSentMsg':'Your message has been sent.','contactFormMessageNotSentMsg':'Message could not be sent. Please try again later.','contactFormInvalidEmailMsg':'A valid email address is required.','contactFormEmptyMessageMsg':'Message field cannot be empty.','title':'Contact Form','blogId':BlogId,'contactFormNameMsg':'Name','contactFormEmailMsg':'Email','contactFormMessageMsg':'Message','contactFormSendMsg':'Send','submitUrl':'https://www.blogger.com/contact-form.do'},'displayModeFull'));
</script>

*Jangan izinkan komentar blog pada halaman kontak jika kalian tidak ingin menampilkan komentar pada halaman kontak. kemudian klik Publikasikan.

Selanjutnya kita lihat hasilnya dan mencoba untuk mengirim sebuah pesan, jika berhasil maka akan muncul pesan "Your message has been sent" dan ada email masuk pada akun gmail yang di gunakan untuk login blogger.

Setelah itu copy link halaman kontak yang sudah di buat tadi, untuk ditambahkan kedalam menu navigaisi.

*Menambahkan menu kontak kedalam menu navigasi, menyesuaikan dengan template yang kalian gunakan, jika template kalian menggunakan widget pagelist sebagai menu navigasi biasanya akan otomatis muncul nama halam kontak yang sudah di publikasikan. Jadi tinggal edit widget - ceklis halaman kontak - simpan.

Selamat mencoba!!!