طريقة التركيب
ملاحضة بسيطة : ننصح باخذ نسخة إحتياطية تحسباً لأى أخطاء لا قدر الله
- ادخل إلى لوحة تحكم المدونة
- اختر قالب
- اضغط على تحرير HTML
- ابحث عن الوسم ]]></b:skin> و اضف الكود التالي قبله مباشرة
- مجدداً نبحث عن الكود التالى <body> ونضع الكود التالى أسفلة مباشرة
#ia-contact .ContactForm {margin: 0px!important;}
#ia-contact .contact-form-button-submit {max-width: none;width: 100%;height: 35px;border: 0;background-color: #424242;cursor: pointer;font:13px;font-style: normal;font-weight: 400;}
#ia-contact .contact-form-button-submit:hover {background-color: #FF9900;border: 0;}
#ia-contact #contact {position: fixed;bottom: 0;right: 1%;background-color: #EEE;color: #555;width: 300px;z-index: 1.0E+15;}
#ia-contact #contact .contact-form-widget {padding: 30px;display: none;}
#ia-contact #contact {position: fixed;bottom: 0;right: 1%;background-color: #EEE;color: #555;width: 300px;z-index: 1.0E+15;}
#ia-contact #contact h2.title {margin: 0px;font-weight: 400;background-color: #424242;color: #FFF;padding: 8px 15px;font-size: 16px;cursor: pointer;letter-spacing: 3px;text-align: center;}
#ia-contact #contact h2.title .fa {position: absolute;left: 10px;top: 12px;}
#ia-contact #contact .contact-form-widget {width: 300px;padding: 30px;display: none;}
#ia-contact #contact * {transition: all 0 ease;-webkit-transition: all 0 ease;-moz-transition: all 0 ease;-o-transition: all 0 ease;}
#ia-contact #contact .contact-form-name,#contact .contact-form-email,#contact .contact-form-email-message {text-align: right;background-color: #DDD;color: #111;border: 0;padding: 5px 5px ;font: normal normal 13px ;}
#ia-contact .contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-widget {max-width: none;margin-bottom: 15px;}
<div id='ia-contact'>
<b:section class='contact' id='contact' maxwidgets='1' showaddelement='yes'>
<b:widget id='ContactForm2' locked='true' title='إتصل بنا' type='ContactForm'>
<b:includable id='main'>
<b:if cond='data:title != ""'><h2 class='title'><i class='fa fa-paper-plane'/> <data:title/></h2></b:if>
<div class='contact-form-widget'>
<div class='form'>
<form name='contact-form'>
<input class='contact-form-name' expr:id='data:widget.instanceId + "_contact-form-name"' exprlaceholder='data:contactFormNameMsg' name='name' size='30' type='text' value=''/>
<input class='contact-form-email' expr:id='data:widget.instanceId + "_contact-form-email"' exprlaceholder='data:contactFormEmailMsg' name='email' size='30' type='text' value=''/>
<textarea class='contact-form-email-message' cols='25' expr:id='data:widget.instanceId + "_contact-form-email-message"' exprlaceholder='data:contactFormMessageMsg' name='email-message' rows='5'/>
<input class='contact-form-button contact-form-button-submit' expr:id='data:widget.instanceId + "_contact-form-submit"' expr:value='data:contactFormSendMsg' type='button'/>
<div style='text-align: center; max-width: 222px; width: 100%'>
<p class='contact-form-error-message' expr:id='data:widget.instanceId + "_contact-form-error-message"'/>
<p class='contact-form-success-message' expr:id='data:widget.instanceId + "_contact-form-success-message"'/>
</div>
</form>
</div>
</div>
</b:includable>
</b:widget>
</b:section>
</div>
<script type='text/javascript'>
//<![CDATA[
$( "#contact h2.title" ).click(function() {$( "#contact .contact-form-widget" ).toggle("fast");});
//]]>
</script>
