26 أغسطس 2015

مدون محترف اضافات بلوجر نصائح للمدونين إضافة نموذج إتصال بلوجر في الصفحة الرئيسية

إضافة نموذج إتصال بلوجر في الصفحة الرئيسية

إضافة نموذج الإتصال بالصفحة الرئيسية في بلوجر

إضافة نموذج إتصال بلوجر في الصفحة الرئيسية - اليوم على مدون محترف سوف نشارككم كيفية تثبيت نموذج الإتصال في الصفحة الرئيسية الخاصة بالمدونة و هذا يعني إن الإضافة سوف تظهر بالرئيسية الخاصة بمدونتك في اسفل الزاوية.

ايضاً أداة نموذج الإتصال بأي شكلٍ كانت فهي يجب ان تكون في مدونة بلوجر بشكل اساسي لإنها تعمل على ربط بين الزائر و صاحب المدونة على التواصل مع بعضهم البعض عن طريق الرسائل و هي ايضاً لا تحتاج إلى تسجيل الدخول إلى بريدك الإلكتروني فقط كل ما عليك فعله هو كتابة إسمك و عنوان بريدك الإلكتروني و محتوى الرسالة و الضغط على إرسال.

ننصحك بقراءة:  اضافة نموذج اتصال مدون محترف


شرح تركيب النموذج


  1. ادخل إلى لوحة تحكم بلوجر
  2. انقر على تبويب قالب
  3. اضغط على تحرير HTML

ابحث عن الوسم ]]></b:skin> و اضف الكود التالي فوقه
/* 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:350px;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:0px 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:0px 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;font-family:droid arabic kufi;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}


الان ابحث عن الوسم </body> و اضف الكود التالي فوقه
<script type='text/javascript'>
//<![CDATA[
// Fixed Contact Form
$("body").append('<div class="floating-ai"><div class="floating-ai-head"><a href="#no-move">اتصل بنا</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>

ملاحظة: إذا كانت هناك اي اكواد لنموذج إتصال اخر يجب إزالتها جميعاً حتى تعمل الإضافة
اي سؤال او استفسار لا تترد بوضعه في تعليق


مواضيع ذات صلة
إضافة نموذج إتصال بلوجر في الصفحة الرئيسية
4 / 5
بواسطة

هناك 16 تعليقًا :

  1. أزال أحد مشرفي المدونة هذا التعليق.

    ردحذف
    الردود
    1. قد يكون هناك كود في مدونتك متعارض مع الإضافة لذلك تظهر فارغة
      بالنسبة للقالب فهو جميل
      ولكن يحتاج إلى بعض التطويرات ايضاً
      بالنسبة للرد اعتذر لمسحه بسبب الراوبط
      بالتوفيق

      حذف
  2. شكرا لك اخى تم إضافة الإداة والحمد لله تعمل ولكن تجعل القالب بطئ بشده فحذفتها
    ولكن اقدر جهدك فى عرض الاضافه شكرا لك

    ردحذف
    الردود
    1. لا اظن إنها تبطيء القالب لإن اكوادها بسيطة
      قد يكون سبب البطيء من الصور فحاول على قدر الإمكان التقليل من حجم الصور عن طريق الضغط
      ولا شكر على واجب

      حذف
  3. أزال أحد مشرفي المدونة هذا التعليق.

    ردحذف
  4. أزال أحد مشرفي المدونة هذا التعليق.

    ردحذف
    الردود
    1. لاحظت المشكلة ولم اعرف حلها
      فالإضافة تعمل على قوالب معينة

      حذف
  5. هل تعمل الاضافة أخي على قالب برو فيجن

    ردحذف
    الردود
    1. والله ما اعرف جرب صديقي
      من المُمكن ان تعمل

      حذف
  6. =q =w =s =d =f =g =h =t =y =u =z =x =c =v =b =n =m =a =e =r

    ردحذف
    الردود

    1. =q =w =s =d =f =g =h =t =y =u =z =x =c =v =b =n =m =a =e =r

      حذف
  7. اخى اضيفت الاضافة ولكنها فارغة ما العمل

    ردحذف
    الردود
    1. هي لا تدعم جميع القوالب
      او قد يكون هناك تعارض بينها وبين إضافة أخرى

      حذف

يسعدنا تفاعلكم بالتعليق , لكن يرجى مراعاة الآداب العامة وعدم نشر روابط إشهار حتى ينشر التعليق , ويمكنك ان تستخدم الإبتسامات بالوقوف عليها لمعرفة الكود. اولا تضع الـ = بعدها الحرف الخاص بالإبتسامة
=q =w =s =d =f =g =h =t =y =u =z =x =c =v =b =n =m =a =e =r