إضافة أداة " أتصل بنا " العائمة أسفل مدونة بلوجر

- خطوات تركيب الاضافة

- إذهب لـ Blogger >> Template >> Edit HTML

- ثم إضغط CTRL +F لتبحث عن الكود التالى

]]></b:skin>

- بعد أن تجد الكود السابق قم بنسخ الكود التالى قبله

#giunx-contact .ContactForm {
     margin: 0px!important;
 }
 #giunx-contact .contact-form-button-submit {
     max-width: none;
     width: 100%;
     height: 35px;
     border: 0;
     background-image: none;
     background-color: #FA411E;
     cursor: pointer;
     font: normal normal 13px Open Sans;
     font-style: normal;
     font-weight: 400;
 }
 .#giunx-contact .contact-form-button-submit:hover {
     background-color: #222;
     background-image: none;
     border: 0;
 }
 #giunx-contact #contact {
     position: fixed;
     bottom: 0;
     right: 1%;
     background-color: #EEE;
     color: #555;
     width: 300px;
     z-index: 1.0E+15;
 }
 #giunx-contact #contact .contact-form-widget {
     padding: 30px;
     display: none;
 }
 #giunx-contact #contact {
     position: fixed;
     bottom: 0;
     right: 1%;
     background-color: #EEE;
     color: #555;
     width: 300px;
     z-index: 1.0E+15;
 }
 #giunx-contact #contact h2.title {
     margin: 0px;
     font-weight: 400;
     background-color: #FA411E;
     color: #FFF;
     padding: 8px 15px;
     font-size: 16px;
     cursor: pointer;
     letter-spacing: 3px;
     text-align: center;
 }
 #giunx-contact #contact h2.title .fa {
     position: absolute;
     left: 10px;
     top: 12px;
 }
 #giunx-contact #contact .contact-form-widget {
     width: 240px;
     padding: 30px;
     display: none;
 }
 #giunx-contact #contact * {
     transition: all 0 ease;
     -webkit-transition: all 0 ease;
     -moz-transition: all 0 ease;
     -o-transition: all 0 ease;
 }
 #giunx-contact #contact .contact-form-name,#contact .contact-form-email,#contact .contact-form-email-message {
     background-color: #DDD;
     color: #111;
     border: 0;
     padding: 10px 5px;
     font: normal normal 13px Open Sans;
 }
 #giunx-contact .contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-widget {
     max-width: none;
     margin-bottom: 15px;
 }

- الآن قم باضافة اكواد الـ HTML بين الوسمين
<body> </body>
أى بعد الوسم <body>
أو قبل الوسم </body>



    
      
  
    


 




        
                <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>
<div style="font-size:11px;">
<a href="http://homeblog7.blogspot.com/2014/12/blog-post_45.html">مصدر الاضافة</a></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>
</pre>
</blockquote>

- احفظ القالب .

0 Comments:

رسالة تنبيه

يسعدنا تفاعلكم بالتعليق لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق :

أن لا تضع أي روابط خارجية

أي سؤال خارج محتوى التدوينة يرجى استخدام صفحة الدعم الفني

صفحة الدعم الفني

أن يكون التعليق خاص بمحتوى التدوينة إضافة أداة " أتصل بنا " العائمة أسفل مدونة بلوجر

لإضافة كود حوله أولا بمحول الأكواد

انقرهنا لتحويل الكود

إرسال تعليق

Item Reviewed: إضافة أداة " أتصل بنا " العائمة أسفل مدونة بلوجر Description: إضافة أداة " أتصل بنا " العائمة أسفل مدونة بلوجر Rating: 5 Reviewed By: home blogger

آخر الأخبار

إضافة أداة " أتصل بنا " العائمة أسفل مدونة بلوجر

0 Comments:

إرسال تعليق

المشاركات الشائعة

أرشيف

التسميات

خدماتي في خمسات

مساحة إعلانية

المتابعون