Tuesday, February 5, 2019

Cara Membuat Contact Us Keren Mudah

Cara Membuat Contact Us Keren Mudah


Contact Us/Kontak Kami merupakan halaman yang berisi form untuk membuat menyampaikan pesan , kritik , saran dan lainnya kepada seorang Admin website secara langsung atau pribadi. contact form ini juga dapat meningkatkan kualitas dan kinerja pada web blog kita. Sebelumnya saya sudah share cara membuat sitemap keren untuk blog.


Step By step Membuat Contact Us Blog| Video |LINK1|LINK2

1. Jangan Lupa dengan Wedang kopi nya Cemilan tentunya hehehe
2. Siapkan Web yang akan dipasang Contact us form
3. kemudian anda login di www.blogger.com
4. Cari menu Halaman pada Dasboard blogger anda
5. Lalu buatlah Halaman Baru
6. Pada Halaman ketik saja Contact Us
7. Lalu pilih tab HTML
8. Copy Paste Code di bawah ini .Setelah itu Publikasikan, Done ....

NB : Pada code 4335393784866517480 ganti blogID anda
         kemudian www.cobatau.com ganti url blog anda
code :

Silakan isi form di bawah ini untuk menghubungi admin. Jika tidak ada halangan dan kesibukan lainnya, admin akan langsung merespon pesan yang Anda kirimkan.

<form id="kontak-arlina" name="contact-form">

<input id="ContactForm1_contact-form-name" name="name" placeholder="Name *" size="30" type="text" value="" />

<input id="ContactForm1_contact-form-email" name="email" size="30" placeholder="Email *" type="text" value="" />

<input id="ContactForm1_contact-form-email" name="email" size="30" placeholder="Handphone *" type="text" value="" />

<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="Message *" rows="5"></textarea>
<input id="ContactForm1_contact-form-submit" type="button" value="Send Message" />  
<div style="max-width: 100%; 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}
form.payforpal{margin:auto;text-align:center}
#kontak-arlina{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 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:#1abc9c;margin:auto;vertical-align:middle;cursor:pointer;padding:16px 20px;font-size:14px;text-align:center;letter-spacing:.5px;border:0;width:100%;border-radius:4px;color:#fff;font-weight:500;transition:all .2s ease}
#ContactForm1_contact-form-submit:hover{background:#16a085;color:#fff;}
#ContactForm1_contact-form-error-message,#ContactForm1_contact-form-success-message{width:100%;margin-top:35px}
.contact-form-error-message-with-border{background:#f47669;border:0;box-shadow:none;color:#fff;padding:5px 0;border-radius:3px}
.contact-form-success-message{background:#4fc3f7;border:0;box-shadow:none;color:#fff;border-radius:3px}
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%;}}
</style>
<script type="text/javascript">
//<![CDATA[
if (window.jstiming) window.jstiming.load.tick('widgetJsBefore');
//]]>
</script>
<script src="https://www.blogger.com/static/v1/widgets/2271878333-widgets.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
if (typeof(BLOG_attachCsiOnload) != 'undefined' && BLOG_attachCsiOnload != null) { window['blogger_templates_experiment_id'] = "templatesV1";window['blogger_blog_id'] = '4335393784866517480';BLOG_attachCsiOnload(''); }_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d4335393784866517480','//www.cobatau.com/','4335393784866517480');
_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': '4335393784866517480','contactFormNameMsg': 'Name', 'contactFormEmailMsg':'Email','contactFormMessageMsg':'Handphone', 'contactFormMessageMsg':'Message','contactFormSendMsg':'Send','submitUrl':'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));
//]]>
</script>


Terimakasih Teman Teman Sudah Mampir. Semoga bermanfaat :)

Silahkan berkomentar dengan bijak sesuai topik pembahasan...
EmoticonEmoticon