Cara Mudah Membuat Halaman Contact Us di Blogspot

Jadi ceritanya, saya coba mengirim tes pesan melalui halaman contact us di blog ini. Dan ternyata ... tidak terkirim. Kode script halaman contact ini saya dapatkan satu paket dengan sebuah template blog yang pernah saya beli (dan sudah berhenti dikirimi update selepas versi 8.4.0. Saya sendiri tidak tahu kenapa). Karena tidak terkirim, maka saya hapus halaman itu. Sekedar informasi, saya sebelumnya pernah melakukan itu dan bisa berfungsi halaman kontaknya. Entah kenapa yang ini tidak berhasil.

Karena penasaran, saya coba cek lagi baris kodenya. Saya berhasil menemukan adanya url blog dan ID blog yang ternyata bukan ID blog ini.

"Mungkin ini masalahnya!" pikir saya.

Jadi, saya ganti saja kode-kode itu dengan yang sesuai untuk blog ini. Saya klik Perbarui laman, dan saya langsung lakukan tes lagi. Saya coba kirim pesan melalui halaman kontak baru. Dan .... tidak terkirim. Lagi.

Jadi saya hapus lagi halaman itu. Buat apa ada kalau ga guna. Ya 'kan?

Inilah salah satu repotnya blogspot. Mau buat halaman kontak saja susah. Kalau di Wordpress, tinggal pakai plugin, beres. Tapi, nilai lebihnya, kita jadi belajar tentang bagaimana cara kerja halaman kontak kalau memakai blogspot.

Sebenarnya, saya mau biarin saja blog ini ga ada halaman kontaknya. Tapi, kaya-nya wagu saja. Masa blog ga ada info kontaknya. Jadi, saya tetap meneruskan mencari cara bagaimana memiliki halaman kontak di blog ini. Walau tidak pernah ada yang menghubungi saya via email. Haha..

Setelah mencoba, akhirnya saya bisa memasangnya. Dan saya tes berhasil. Ini ujudnya. Berikut kode yang saya pakai di halaman kontak.

<div class='contact-form-widget'>
<div class='form'>
<form name='contact-form'>
<span class='input-label'>Nama</span>
<input aria-label='contact name' class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' type='text' value=''/>
<span class='input-label'>Email
<span class='required'>*</span></span>
<input aria-label='contact email' class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' type='text' value=''/>
<span class='input-label'>Pesan
<span class='required'>*</span></span>
<textarea aria-label='message' class='contact-form-email-message' cols='25' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
<input aria-label='submit button' class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Kirim'/>
<div class='contact-form-message-wrap'>
<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>
</div>
</div>
<script type="text/javascript" src="https://www.blogger.com/static/v1/widgets/2092647672-widgets.js"></script>
<script type='text/javascript'>
window['__wavt'] = 'AOuZoY7n4L9lKAZ8Sfm-zRM4TVqbCZECYw:1671091440211';_WidgetManager._Init('//www.blogger.com/rearrange?blogIDx3dBlogID','//www.URLBLOG.id/','BlogID');
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'sidebar', document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': 'Mengirim...', 'contactFormMessageSentMsg': 'Pesan sudah dikirim.', 'contactFormMessageNotSentMsg': 'Pesan tidak dapat dikirim. Coba lagi nanti.', 'contactFormInvalidEmailMsg': 'Alamat email harus valid.', 'contactFormEmptyMessageMsg': 'Bidang pesan harus diisi.', 'title': 'Formulir Kontak', 'blogId': 'BlogID', 'contactFormNameMsg': 'Nama', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Pesan', 'contactFormSendMsg': 'Kirim', 'contactFormToken': 'AOuZoY7CscM8laSe_KBjfi6cbwoagl4YfA:1671091440213', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));
</script>

Kalau Anda ingin menggunakan kode di atas untuk halaman contact us blog sampeyan, silahkan copy, dan ganti BlogID serta URLBlog Anda sendiri

BlogID = ID blog Anda sendiri. Ini numerik. Jadi isinya angka. Anda bisa menemukan ID blog anda sendiri dengan login ke blog anda di blogger. com, dan lihat ke address bar setelah berhasil login. Angka paling belakang adalah ID blog.

URLBlog = ganti dengan nama domain anda sendiri.

Kalau misal cara ini tidak berhasil, maksudnya, form contact tidak mengirim, maka ikuti langkah di bawah ini. Ini bisa jadi karena contact form token masing-masing blog itu berbeda.

Jadi, Anda harus mengikuti langkah yang saya telah lakukan untuk mendapatkan kode di atas, untuk mendapatkan kode HTML dan JS Formulir Kontak blog Anda sendiri, beserta contact form token-nya.

Langkah-langkah

• Pasang widget Formulir Kontak melalui Tata Letak/Layout blog. Silahkan pasang bebas saja. Sidebar boleh footer boleh.
• Refresh halaman blog kita. Akan terlihat Formulir Kontak di Sidebar/Footer
• Klik kanan pada bidang halaman dan klik "Lihat sumber halaman".
• Tekan Ctrl+F lalu masukkan kata "Fomulir Kontak". (tanpa tanda petik). lalu tekan enter. Anda akan dibawa ke blok kode HTML dari formulir kontak itu. Anda bisa melihat kode yang saya bagikan di atas untuk mengetahui yang mana blok kode HTML-nya.
• Copy blok kode yang Anda temukan itu dan paste di notepad atau notepad ++. Kemudian, scroll ke paling bawah. Anda akan menemukan 2 javascript (JS) --> (lihat kembali kode saya di atas untuk mengetahui blok kode JS-nya.) untuk JS yang pertama kode-nya sama. JS yang kedua yang kita butuhkan hanya untuk Formulir Kontak saja. Karena di sana kita akan melihat juga JS untuk widget-widget lain yang kita pasang. (silahkan lihat ulang kode saya di atas.)
• Jika sudah ketemu, silahkan copy dan paste di bawah blok kode HTML yang kita copas pertama tadi ke notepad.
• Selanjutnya, copy semua kode.
• Buat halaman kontak anda di blog. Buka mode HTML. Paste kode di halaman itu.
• Jangan lupa atur Opsi komentar untuk halaman itu.
• Publikasikan.
• Selesai

Anda bisa hapus widget Formulir Kontak yang tadi di awal dipasang di sidebar/footer blog melalui Tata Letak/Layout. Itu urutannya.

Semoga berhasil.