#Portal9, Cara membuat Widget Fixed Contact Form di Blog
Dalam hal ini mengindikasikan informasi yang disampaikan secara akurat
masukkan script iklan disini2
Mungkin Cara membuat Widget Fixed Contact Form di Blog
diperlukan , sebagai sarana komunikasi antar pembaca blog kamu.
Terlebih dahulu pastikan dalam Blog kamu sudah ada contact form diletakkan dalam Layout
Ikuti panduang singkatnya ;
diperlukan , sebagai sarana komunikasi antar pembaca blog kamu.
Terlebih dahulu pastikan dalam Blog kamu sudah ada contact form diletakkan dalam Layout
Ikuti panduang singkatnya ;
Contact Form
Cara membuat Widget Fixed Contact Form Di Blog
Baru kemudian masukkan data kode dibawah di HTML Blog dengan ;
1. Pada posisi blog html,menggunakan Control F temukan dan
letakkan diatas b/skin atau style
2. Sebelum </body> letakan
3. simpan template >> selesai
Bacalah juga ; Facebook tampil seperti twitter
Pastikan setiap Blog yang kamu buat tersedia dengan adanya Contact Form ini.
1. Pada posisi blog html,menggunakan Control F temukan dan
letakkan diatas b/skin atau style
/* Fixed Contact Form */
.ContactForm,.ContactForm .title{display:none}
.floating-ai{position:fixed;width:280px;right:30px;bottom:0;z-index:99}
.floating-ai-head a{padding:8px 10px;background:#2997e0;color:#fff;font-weight:400;display:inline-block;transition:all .3s linear}
.floating-ai-head a:hover{background:#2588ca;color:#fff}
.floating-ai-body{height:285px;background:#fff;padding:10px;display:none;box-shadow:0 2px 5px 0 rgba(0,0,0,.26)}
.floating-ai-head{text-align:right}
.floating-ai-body .ContactForm{margin:0;display:block!important}
#ContactForm1_contact-form-name,#ContactForm1_contact-form-email{background:#fff;border:0;padding:10px 0;color:#999;font-weight:normal;width:100%;max-width:initial;border-bottom:1px solid #ccc;transition:.2s ease all}
#ContactForm1_contact-form-email-message{background:#fff;border:none;color:#8f8f8f;padding:10px 0;width:100%;max-width:initial;border-bottom:1px solid #ccc}
#ContactForm1_contact-form-name:focus,#ContactForm1_contact-form-email:focus,#ContactForm1_contact-form-email-message:focus,#ContactForm1_contact-form-name:hover,#ContactForm1_contact-form-email:hover,#ContactForm1_contact-form-email-message:hover{background:#fff;box-shadow:none;border-bottom-color:#ff3c3c;transition:all .3s linear}
#ContactForm1_contact-form-submit{position:relative;color:#fff;font-weight:400;font-size:12px;cursor:pointer;background:#57ad68;border:none;float:left;box-shadow:0 0 0 0 rgba(0,0,0,0.19);transition:all .3s linear}
#ContactForm1_contact-form-submit:hover{background:#468a53;}
#ContactForm1_contact-form-submit:active{box-shadow:0 4px 15px 0 rgba(0,0,0,0.19);}
.contact-form-widget form{display:table;margin:0 auto;}
.contact-form-widget {max-width:initial;}
.floating-ai-body{-moz-box-sizing:initial;-webkit-box-sizing:initial;box-sizing:initial}2. Sebelum </body> letakan
<script type='text/javascript'> //<![CDATA[// Fixed Contact Form$("body").append('<div class="floating-ai"><div class="floating-ai-head"><a href="#no-move">Contact Form</a></div><div class="floating-ai-body"></div></div>'),$(".ContactForm").appendTo(".floating-ai-body");var slide_up_ai=!1;$(".floating-ai-head a").click(function(){slide_up_ai?(slide_up_ai=!1,$(".floating-ai-body").slideUp()):(slide_up_ai=!0,$(".floating-ai-body").slideDown())}); //]]></script>
3. simpan template >> selesai
Bacalah juga ; Facebook tampil seperti twitter
Pastikan setiap Blog yang kamu buat tersedia dengan adanya Contact Form ini.
Selain memudahkankan pembaca kamu menghubungi juga tetap menjalin komunikasi 2 arah yang saling bersinergi .
Semoga bermamfaat
