تنسيق وتخصيص نموذج اتصل بنا لمدونات بلوجر


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

طريقة تركيب الاضافة .

أولا قم بإضافة الأداة الأساسية المقدمة من بلوجر ..
عن طريق فتح لوحة التحكم >> التخطيط >> مزيد من الأدوات >> نموذج الاتصال
ويُفضل أن تكون في الفوتر .
كما في الصورة التالية *اضغط على الصورة للتكبير*


بعد تركيب الأداة في المكان المناسب .. إذهب الى لوحة التحكم >> قالب >> ــ تحرير HTMLــ
بع ذلك ابحث عن الكود التالي  ]]></b:skin>


.contact-form-name, .contact-form-email, .contact-form-email-message, .contact-form-widget {
max-width: none;
margin-bottom: 15px;
}
.contact-form-name, .contact-form-email, .contact-form-email-message {
background-color: #fff;
border: 0;
}
.contact-form-widget .form {
}
.contact-form-button-submit {
max-width: none;
width: 100%;
height: 35px;
border: 0;
background-image: none;
background-color: #1babbc !important;
cursor: pointer;
font-family: GESSTwoMediumRegular;
font-style: normal;
font-weight: 400;
}
.contact-form-name:focus, .contact-form-email:focus, .contact-form-email-message:focus {
border: 0;
box-shadow: none;
}
.contact-form-name:hover, .contact-form-email:hover, .contact-form-email-message:hover {
border: 0;
}
.contact-form-button-submit:hover {
background-color: #222;
background-image: none;
border: 0;
}
 -----end code by ebd3h.blogspot.com------------

اللون الأزرق هو لون الزر .. قم باستبداله بما يناسبك .
ثم احفظ القالب وقم بمعاينة النتيجة بنفسك .. ولاحظ الفرق في الحجم والشكل .
أتمنى أن تكون الاضافة قد أعجبتكم .. انتظرونا دائما في أروع الاضافات والدروس في مدونة ابداع هاوس .. الى اللقاء .

هناك 6 تعليقات:

  1. اضافة رائعة شكرا لك
    وشرح اكثر من رائع
    تحياتى لك : كينج نت

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

    ردحذف
  3. الردود
    1. أزال المؤلف هذا التعليق.

      حذف
    2. موجودة الطريقة في الشرح .. بعد اضافتك لأداة نموذج الاتصال الافتراضية من بلوجر .. ستظهر في المكان المطلوب ..
      الان أن تريد أن تقوم بتنسيقها لتظهر بالشكل الموجود في الصورة ..
      عليك التوجه إلى لوحة التحكم >> تحرير القالب >> HTML
      ثم ابحث عن ]]> عن طريق الضغط على ctrl + F
      ثم ضع الكود أعلاها .

      حذف