Lapakinfo.net - Masih bersama lapak info, kali ini saya selaku admin lapak info akan membagikan sebuah tutorial tentang
Cara Membuat Hubungi Kami Atau Contact Us DI Halaman Blogger Dengan Mudah, sebelum lanjut ke tutorial saya akan sedikit menjelaskan tentang membuat contact us di halaman statis blog. Form kontak atau biasa kita kenal dengan Contact Us itu berfungsi untuk memudahkan user atau pengunjung untuk menghubungi
CEO blog tersebut secara pribadi, selain berfungsi untuk memudahkan pengunjung untuk menghubungi
CEO blog tersebut, dengan memasang form kontak pada blog kalian itu juga syarat wajib untuk mendaftar ke Google Adsense. Jadi jika blog kalian ingin mendaftar ke Google Adsense jangan lupa di pasang form kontak dulu.
Sebenarnya manfaat dari memasang form kontak itu sangatlah banyak sekali seperti jika ada user yang melaporkan bug di blog kita dan jika ada user yang mau kerjasama dengan kita. Untuk membuat form kontak ini sangatlah mudah sekali, kalian tidak perlu mengedit template kalian. Cukup melalui halaman statis saja, untuk lebih jelasnya silahkan kalian simak tutorialnya di bawah ini.
Cara Membuat Hubungi Kami Atau Contact Us DI Halaman Blogger Dengan Mudah
1. Buka
Blog kalian.
2. Pilih
Halaman lalu buatlah halaman baru ( New entry ).
3. Buatlah judulnya contoh : Hubungi Kami atau Contact Us.
4. Masuk ko
Mode HTML.
5. Salin kode di bawah ini dan pastekan tepat di dalam
Mode HTML pada halaman statis kalian.
<style>
/* Contact Form */
#comments,.post_meta,#blog-pager{display:none}form{color:#666} #kontak{margin:auto;max-width:640px} #ContactForm1_contact-form-name,#ContactForm1_contact-form-email{height:auto;margin:5px auto;padding:15px 12px;background:#fff;color:#444;border:1px solid #1d2129;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 #1d2129;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:#008c5f;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:#1d2129;color:#fff}#ContactForm1_contact-form-error-message,#ContactForm1_contact-form-success-message{width:100%;margin-top:35px}.contact-form-error-message-with-border{background:#1d2129;border:none;box-shadow:none;color:#fff;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}
</style>
<form id="kontak" name="contact-form">
<input id="ContactForm1_contact-form-name" name="name" placeholder="Nama" size="30" type="text" value="" />
<input id="ContactForm1_contact-form-email" name="email" size="30" placeholder="Email" type="text" value="" />
<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="Isi pesan" rows="5"></textarea>
<input id="ContactForm1_contact-form-submit" type="button" value="Kirim Pesan"/>
<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>
<script src="https://www.blogger.com/static/v1/widgets/2271878333-widgets.js"></script>
<script>//<![CDATA[
if (typeof(BLOG_attachCsiOnload) != 'undefined' && BLOG_attachCsiOnload != null) { window['blogger_templates_experiment_id'] = "templatesV1";window['blogger_blog_id'] = '9999000000000000009';BLOG_attachCsiOnload(''); }_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d9999000000000000009','//www.URLBLOGSOBAT.com/','9999000000000000009');
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'footer1', null, 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': '9999000000000000009', 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));
//]]></script>
Keterangan :
9999000000000000009 Ganti dengan ID blog kalian.
www.URLBLOGSOBAT.com Ganti dengan Url blog kalian tanpa menggunakan Http maupun Https.
6. Publish halaman kalian dan selesai.
7. Setelah di publish silahkan Copy Url Link halaman Contact Us kalian lalu pastekan pada template kalian.
Mungkin itu saja yang bisa saya sampaikan tentang
Cara Membuat Hubungi Kami Atau Contact Us DI Halaman Blogger Dengan Mudah, form saya desain sesimpel dan sedinamis mungkin supaya mempunyai tampilan yang sederhana dan menarik.
Jika kalian mempunyai pertanyaan seputar postingan di atas atau tentang blogger silahkan kalian bertanya melalui kolom komentar yang ada di bawah ini atau bisa juga melalui Contact Us. Terimakasih sudah berkunjung dan semoga bermanfaat buat kalian semua.
