الجمعة، 11 يناير 2013

اضافة اطار حول عناوين التدوينة بشكل جذاب ومميز مع التحكم الكامل

كيفية اضافة اطار او برواز حول عناوين الموضوع بشكل اكثر من رائع بالتحكم الكامل فى الالوان وبخاصية css طريقة مميزة تم تجربتها على مدونة تجريبية وهى تعمل بشكل سليم واكثر من رائع وبدون اخطاء سوف اضع لكم كيفية تغير الالوان لتتناسب مع شكل استايل مدونتك  هذه الطريقة رايتها بمدونة اجنبية وبحثت عن هذه الطريقة لكى اضعها لكم لتعم الفائدة للجميع وبالأخص  المدونين العرب نأتى الأن الى طريقة تركيب الكود البسيط فى البداية وكما تعودنا لتجنب المشاكل والبعض عن اى اخطاء يجب اخذ نسخة احتياطية لقالب مدونتك لتفادى حدوث اى خطاء اذا كنت لا تعرف طريقة اخذ نسخة احتياطية لقالب المدونة ادخل الى هذه التدوينة لتعرف الطريقة درس للمبتدئين اخذ نسخة احتياطية لقالب المدونة الأن بعض ما قمنا بأخذ نسخة احتياطية قم بعمل التالى :

فى البداية ادخل الى لوحة تحكم مدونتك ومن بعدها اضغط على القالبالأن اضغط على تحرير HTML














الان اضغط على زر متابعة












الان قم بتوسيع القالب كما واضح لتا بالصورة التالية













الان اضغط على CTRL + F من الكيبورد لظهور عملية البحث عن الأكود بالمتصفح
ابحث عن هذا الكود :

]]></b:skin>
اضف قبلة مباشرة هذا الكود :

 /*----Widget Heading Tag----*/
h3{
font-family:arial !important;
font-style:arial !important;
}
.post h3 {
color:#FFFF00;
border-left:10px solid #FFFF00;
border-right:10px solid #FFFF00;
padding:3px 5px 3px  20px;
border-radius:15px;
-moz-border-radius:15px;
box-shadow:0px 0px 13px #0000FF;
-webkit-box-shadow:0px 0px 13px #0000FF;
-moz-box-shadow:0px 0px 13px #0000FF;
}
.post h3:hover {
color:#FF0000;
border-left:10px solid #FF0000;
border-right:10px solid #FF0000;
box-shadow:0px 0px 13px #00FF00;
-webkit-box-shadow:0px 0px 13px #00FF00;
-moz-box-shadow:0px 0px 13px #00FF00;
}

كيفية تغير الالوان لتتناسب مع شكل استايلك :
الأكواد المعلمة باللون الأحمر تخص بتغير لون الأطار عند وقوف مؤشر الماوس
 الأكواد المعلمة باللون الأخضر تخص حدود الأطار عند وقوف مؤشر الماوس
الأكواد المعلمة باللون الأزرق تخص حدود الأطار بعدم وقوف مؤشر الماوس
الأكواد المعلمة باللون الأصفر تخص جوانب الأطار بعدم وقوف موشر الماوس

صورة لشكل الأطار لعناوين المدونة :













انتهى الشرح وارجو بأن هذه التدوينة افادات الجميع (( لا خير فى كاتم العلم ))

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

  1. مدونتك رائعة وشرحك رائع

    ردحذف
  2. اضافة جميلة يسلمو اخى الحبيب

    ردحذف
  3. شكرا على الاضافة

    ردحذف
  4. عوااافي اخوي
    كود جيد لكن لو يوجد شرح للأكواد او موقع لمعرفة الوان الاكواد كان افضل واسهل بكثير
    لكن يعطيك العافية

    ردحذف
  5. شكراااا على الاضافة

    http://arabworlde.blogspot.com/

    ردحذف

قال تعالى ( مَا يَلْفِظُ مِن قَوْلٍ إِلا لَدَيْهِ رَقِيبٌ عَتِيدٌ )

الموافقة على نشر التعليقات

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