Cara Mudah Membuat Contact Form Pada Halaman Blogger

Dalam sebuah blog, contact form itu sangat diperlukan agar visitor atau pengunjung blog lebih mudah untuk menghubungi pengelola atau admin blog yang di kunjunginya tersebut.

Walaupun contact form bukanlah satu-satunya alat sebagai penghubung antara visitor dan pengelola blog, namun tidak ada salahnya jika kita memudahkan mereka untuk bisa menghubungi kita.

Membuat contact form pada widget itu sudah biasa. Yang belum biasa itu membuat contact form pada halaman. Bagaimana cara memindahkan contact form dari widget ke halaman? Baca terus artikel ini.

Cara Mudah Membuat Contact Form Pada Halaman Blogger

  • Cari nomor blogID dari bog Anda. BlogID tersebut dapat ditemukan ketika Anda membuka dashboard. Nomor blogID ini berguna untuk menghasilkan kode untuk halaman contact form yang baru. Gambar dibawah ini menunjukkan bagaimana cara mendapatkan blogID tersebut

  • Sekarang buat halaman baru

Copy dan edit kode di bawah ini. Jangan lupa untuk mengganti bogID yang di tandai dengan warna merah dengan nomor blogID Anda.

<script>
var blogId = '39552176175888359894';//this number should be mandatorily edited.
//The below message 5 Strings can also be edited
var contactFormMessageSendingMsg ='Sending...';
var contactFormMessageSentMsg = 'Your message has been sent.';
var contactFormMessageNotSentMsg = 'Message could not be sent. Please try again later.';
var contactFormEmptyMessageMsg ='Message field cannot be empty.';
var contactFormInvalidEmailMsg = 'A valid email is required.'

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>
<form name='contact-form'>
<div>Your Name : </div>
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' type='text' value=''/>
<div>Your Email: <em>(required)</em></div>
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' type='text' value=''/>
<div>Your Message: <em>(required)</em></div>
<textarea class='contact-form-email-message' 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='Send' onclick="sendEmailMsg()"/>
<div style='text-align: center; max-width: 450px; 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>

Pada saat membuat halaman baru jangan lupa untuk beralik ke mode HTLM seperti yang di tunjukkan gambar di bawah ini


  • Setelah halaman di publish jika tombol send pada contact form di klik maka semua email admin akan mendapatkan kiriman form tersebut

Demikianlah tips Cara Mudah Membuat Contact Form Pada Halaman Blogger.

Semoga bermanfaat :)

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel