Cara membuat halaman kontak pada blog

Juli 02, 2017
Cara membuat halaman kontak pada blog


Sebuah halaman untuk kontak pada blog sangat penting di buat, selain dijadikan media untuk interaksi/ komunikasi antara pembuat blog dengan pembaca blog tersebut , tentunya dengan adanya formulir kontak ini blog tersebut bisa terlihat profesional.
Berikut gambar contoh formulir kontak

cara membuat halaman kontak pada blog




Disini saya akan berikan cara membuat formulir kontak yang sederhana namun fungsinya sama.
langsung saja ya.

Pertama anda buat telebih dahulu tampilan / laman untuk formulir kontak caranya seperti berikut :

- anda masuk ke menu laman pada drap blogger anda : seperti gambar berikut


Cara membuat halaman kontak pada blog


kemudian anda buat laman baru, sebelum itu mungkin anda bertanya kenapa tidak pada menu post ?. ini hanya jawaban menurut pendapat saya sendiri :  jika anda menggunakan atau membuat formulir laman seperti kontak, privasi dan lainya pada menu post, maka tampilan laman kontak ini akan sama seperti tampilan post artikel - artikel pada blog, sederhananya begini, jika anda setting pada laman post atau artikel anda dengan menyertakan nama penulis, jam, bahkan iklan di bawah judul, maka semua akan munjcul pada laman kontak ini juga kan, sedangkan yang diharapkan pada laman kontak ini hanya formulir kontak saja yang muncul, jadi saya lebih menyarankan untuk laman seperti kontak, privasi, tentang dan sebagainya ( selain laman artikel ) sebaiknya anda buat pada menu laman. tapi sebenarnya itu terserah anda itu hak anda.

sekarang kita lanjut lagi cara membuat laman kontak pada blog.
setelah anda masuk ke laman baru kemudian  anda pilih tombol HTML , gunya untuk mengedit laman melalui html berikut adalah contoh penempatan kode

Cara membuat halaman kontak pada blog




copy kode dibawah ini dan paste pada laman kontak anda seperti gambar diatas

kode membuat laman kontak

<script>
var blogId = 'isi dengan id blog anda';//this number should be mandatorily edited.
//The below message 5 Strings can also be edited
var contactFormMessageSendingMsg ='Mengirim...';
var contactFormMessageSentMsg = 'Pesan Anda telah dikirim.';
var contactFormMessageNotSentMsg = 'Pesan tidak dapat dikirim. Silakan coba lagi nanti.';
var contactFormEmptyMessageMsg ='Kolom pesan tidak boleh kosong.';
var contactFormInvalidEmailMsg = 'Sebuah email yang valid diperlukan.'

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>

<br />
<form name="contact-form">
<div>
<br />
Nama Anda : </div>
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />
<br />
<div>
<br />
Email: <em>(wajib)</em></div>
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />
<br />
<br />
<div>
Pesan: <em>(wajib)</em></div>
<textarea class="contact-form-email-message" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>
<input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" onclick="sendEmailMsg()" type="button" value="Kirim" />

<br />
<br />
<br />
Terimakasih.<br />
<div style="max-width: 450px; 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>

pada script yang anda copy akan terdapat tulisan " isi dengan id blog anda ", nah ganti tulisan tersebut dengan id blog anda, untuk mengetahui id blog anda anda lihat pada url pada bar seperti gambar berikut

Cara membuat halaman kontak pada blog

angka yang terdapat dibawah tanda panah itu merupakan contoh id blog,anda ganti dengan id blog anda.
Setelah semua selesai anda klik tombol publish dan lihat hasilnya.
anda juga bisa lihat halaman kontak pada kontak kami pada link berikut http://www.blogcianjur.com/p/contact.html

Sekian informasi "Blog dari Cianjur " tentang Cara membuat halaman kontak pada blog.

Semoga bermanfaat.

Previous
Next Post »
0 Komentar

Post a Comment