Cara Membuat Menu Contact From Di Blog

Cara membuat halaman menu contact us berupa from, yang berisi Nama, Email dan Pesan yang akan ditujukan kepada Admin pemilik blog. Menu navigasi contact merupakan halaman yang sangat penting untuk pengunjung apabila ingin menghubungi dengan pemilik blog

Maka tidak heran apabila Anda menemukan sebuah menu Contact Us yang berada di bawah atau di atas, setiap blog maupun website yang Anda kunjungi. Karena ini merupakan kebijakan dan kewajiban

Ada bermacam-macam model dan jenis halaman kontak, tergantuk pilihan pemilik blog. Ada yang mengunakan from seperti punya saya, ada juga yang mengunakan alamat email, sosial media dan sejenisnya

Kegunaan dari halaman contact from

Kontak meruapakan sebuah halaman, yang berisi alat yang kegunanya untuk memudahkan pengunjung apabila ingin menghubungi Admin pemilik blog atau website

Biasanya halaman ini akan di buat semudah mungkin untuk digunakan, supaya penguna tidak kesulitan. Dan menurut saya yang paling mudah digunakn dan paling efektif adalah mengunakan FROM. Dengan mengunakan from seseorang hanya tingal mengisi Nama, Email serta Pesan yang ingin di sampaikan kemudian kirim

Selain itu mengunakan media sosial dan nomor ponsel atau nomor yang disediakan kusus untuk Contact sebuah blog/website, juga paling bagus karena akan terhubung secara langsung dan cepat

Cara membuat halaman Contact Us from di blog

Di salah satu artikel blog ini, mendapatkan komentar pertanyaan yang isinya, bagaimana cara membuat contact seperti punya saya

Nah saya akan menuliskan tutorialnya berikut ini, halaman yang berisi contact seperti di blog saya ini tampilanya simple dan keren mudah digunakan, dan pastinya tidak membebani loading blog

1. Login blogger
2. Pilih Halaman
3. Beri judul Contact Us /sesuai kebutuhan
4. Langsung ke HTML jangan di Compoose ya
5. Copy paste kode berikut di dalam HTML kemudian Publikasikan, selesai

Kode CSS + Kode Pemangil

<div style="text-align: justify;"><br /></div><form id="kontak-seo" name="contact-form" style="padding-right: 25px;"><br /><input id="ContactForm1_contact-form-name" name="name" placeholder="Name *" size="30" type="text" value="" /><br /><br /><input id="ContactForm1_contact-form-email" name="email" placeholder="Email *" size="30" type="text" value="" /><br /><br /><textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="Message *" rows="5"></textarea> <br /><input id="ContactForm1_contact-form-submit" type="button" value="Send Message" />  <br /><div style="max-width: 222px; text-align: center; width: 100%;"><div id="ContactForm1_contact-form-error-message"></div><div id="ContactForm1_contact-form-success-message"></div></div></form><style scoped="" type="text/css">#comments,.post_meta,#blog-pager{display:none}form{color:#666}#kontak-seo{margin:auto;max-width:300px}#ContactForm1_contact-form-name,#ContactForm1_contact-form-email{height:auto;margin:5px auto;padding:15px 12px;background:#fff;color:#444;border:1px solid rgba(0,0,0,.14);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);border-radius:3px;width:100%;min-width:100%;transition:all 0.5s ease-out}#ContactForm1_contact-form-email-message{width:100%;height:175px;margin:5px 0;padding:15px 12px;background:#fff;color:#444;border:1px solid rgba(0,0,0,.14);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);border-radius:3px;resize:none;transition:all 0.5s ease-out}#ContactForm1_contact-form-name:focus,#ContactForm1_contact-form-email:focus,#ContactForm1_contact-form-email-message:focus{outline:none;background:#fff;color:#444;border-color:#66afe9;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,0.6)}#ContactForm1_contact-form-submit{float:left;background:#34495e;margin:auto;vertical-align:middle;cursor:pointer;padding:12px 20px;font-size:14px;text-align:center;letter-spacing:.5px;border:0;width:100%;max-width:140px;border-radius:3px;color:#fff;font-weight:500;transition:all .8s ease}#ContactForm1_contact-form-submit:hover{background:#3498db;color:#fff;}#ContactForm1_contact-form-error-message,#ContactForm1_contact-form-success-message{width:100%;margin-top:35px}.contact-form-error-message-with-border{background:#f6f6f6;border:none;box-shadow:none;color:#444;padding:5px 0}.contact-form-success-message{background:#4fc3f7;border:none;box-shadow:none;color:#fff}img.contact-form-cross{line-height:40px;margin-left:5px}.post-body input{width:initial}@media only screen and (max-width:640px){#ContactForm1_contact-form-name, #ContactForm1_contact-form-email,#ContactForm1_contact-form-submit{width:100%;}}.contact_layout{text-align:center;position:fixed;top:0;left:0;bottom:0;right:0;background:rgba(0,0,0,.8);z-index:99999}.contact_message{width:50%;background:#fff;border-radius:5px;padding:20px;border:1px solid transparent;text-align:center;color:#333;position:absolute;top:30%;left:50%;margin-left:-25%;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.contact_message:before{content:"\f164";font-family:FontAwesome;font-weight:500;font-size:30px;display:block;margin-bottom:10px}@media screen and (max-width:768px){.contact_message{width:90%!important;margin-left:-45%!important}}</style><br /><div style="text-align: right;"><div style="text-align: center;"><br /></div></div><script type="text/javascript">//<![CDATA[if (typeof(BLOG_attachCsiOnload) != 'undefined' && BLOG_attachCsiOnload != null) { window['blogger_templates_experiment_id'] = "templatesV1";window['blogger_blog_id'] = 'ISI DENGAN ID BLOGGER ANDA';BLOG_attachCsiOnload(''); }_WidgetManager._Init('//www.blogger.com/rearrange?blogID\ISI DENGAN ID BLOGGER ANDA','//blogtes6.blogspot.com/','ISI DENGAN ID BLOGGER ANDA');_WidgetManager._RegisterWidget("_ContactFormView", new _WidgetInfo("ContactForm1", "footer1", null, document.getElementById("ContactForm1"), {"contactFormMessageSendingMsg": "Sending...", "contactFormMessageSentMsg": "<div class='contact_layout'><div class='contact_message'><b>Your message has been sent</b>.<br/>Jika tidak ada halangan dan kesibukan lainnya, admin akan langsung merespon pesan yang Anda kirimkan.</div></div><br/>", "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": "ISI DENGAN ID BLOGGER ANDA", "contactFormNameMsg": "Name", "contactFormEmailMsg": "Email", "contactFormMessageMsg": "Message", "contactFormSendMsg": "Send", "submitUrl": "https://www.blogger.com/contact-form.do"}, "displayModeFull"));//]]></script>

Pastikan untuk mengisi dengan nomor ID BLOG Anda sebelum disimpan

Diatas itulah contact from yang saya gunakan, contohnya bisa dilihat pada menu yang Ada di bawah blog ini. Hampir ketingalan menu navigasi ini merupakan menu keharusan yang tidak boleh terlewatkan apabila blog mau di daftarkan ke partner pengikalanan Google Adsense supaya di approf

Baca juga : Cara merubah bahasa tampilan dashboard blogger

Postingan singkat kali ini semoga bermanfaat dan membantu, tanyakan di kolom komentar apabila tidak berhasil atau kesulitan.

Update : membuat halaman contact form dengan cara diatas ternyata sudah tidak berfungsi lagi, baru belakang ini saya mengetahui hal ini ada pengunjung yang menginfokan kepada saya lewat komentar bahwa tidak bisa kirim pesan

Nah untuk sekarang saya sudah merubah halaman contact us buat temen-temen yang mengikuti tutorial diatas silahkan di update ke cara yang baru, silahkan lihat caranya di blog arlinadesign com, terimakasih atas perhatianya