طريقة تلوين فئات الصفحة الرئيسية كل فئة بلون خاص + الأكواد

طريقة تلوين فئات الصفحة الرئيسية كل فئة بلون خاص + الأكواد

الآن بامكانك تلوين كل فئة من فئات الصفحة الرئيسية
بلون معين يختلف عن الفئة الأخرى كما في الصورة التالية

طريقة تلوين فئات الصفحة الرئيسية كل فئة بلون خاص + الأكواد 111

الخطوة الاولى

احذف روابط صور خلفيات الفئات اليسرى واليمنى
كما هو موضح بالصورة التالية

طريقة تلوين فئات الصفحة الرئيسية كل فئة بلون خاص + الأكواد 210

طريقة تلوين فئات الصفحة الرئيسية كل فئة بلون خاص + الأكواد 210

الخطوة الثانية

قم بأضافة كود الجافا التالي

الكود::    $(function()
   {
   $('#cat_1').closest('table.forumline').addClass('cat-1');
   $('#cat_2').closest('table.forumline').addClass('cat-2');
   $('#cat_3').closest('table.forumline').addClass('cat-3');
   $('#cat_4').closest('table.forumline').addClass('cat-4');
   $('#cat_5').closest('table.forumline').addClass('cat-5');
   $('#cat_6').closest('table.forumline').addClass('cat-6');
   }
   );
   //by omarpop23

ملحوظة: هذا الكود لعدد 6 فئات فقط فإذا كنت
تريد اضافة فئات أخرى فعليك بتكرار الكود التالي
بعدد الفئات المراد اضافتها

الكود:: $('#cat_*').closest('table.forumline').addClass('cat-*');

مع تغيير * برقم الفئة الجديدة

الخطوة الثالثة

اضافة كود الــ
CSS
التالي في ورقة الأكواد الأنسابية ورقة التصميم
CSS

الكود::    .forumline.cat-1 th {
   background: #FF0000;
   }
   table.forumline.cat-1 {
   border: 1px solid #FF0000;
   background-color: #FF0000;
   }
   .forumline.cat-2 th {
   background: #375468;
   }
   table.forumline.cat-2 {
   border: 1px solid #375468;
   background-color: #375468;
   }
   .forumline.cat-3 th {
   background: #9848EF;
   }
   table.forumline.cat-3 {
   border: 1px solid #9848EF;
   background-color: #9848EF;
   }
   .forumline.cat-4 th {
   background: #3399cc;
   }
   table.forumline.cat-4 {
   border: 1px solid #3399cc;
   background-color: #3399cc;
   }
   .forumline.cat-5 th {
   background: #488E11;
   }
   table.forumline.cat-5 {
   border: 1px solid #488E11;
   background-color: #488E11;
   }

   .forumline.cat-6 th {
   background: #000;
   }
   table.forumline.cat-6 {
   border: 1px solid #000;
   background-color: #000;
   }

ملحوظة: لقد كتبت كود الـــ
CSS
لعدد 6 فئات فقط فاذا كنت تريد اضافة فئات أخرى
فعليك بتكرار الكود التالي بعدد الفئات المراد اضافتها

الكود::    .forumline.cat-* th {
   background: #000;
   }
   table.forumline.cat-* {
   border: 1px solid #000;
   background-color: #000;
   }

مع تغيير * برقم الفئة الجديدة
وتغيير اللون بوضع كود أو رمز اللون الجديد مكان
#000

الخطوة الرابعة

هذه هي أهم خطوة
فعليك اعادة تسمية الفئات ولكن بهذه الطريقة

فمثلا الفئة الأولى تكتب كما في الكود التالي

الكود:: اسم الفئة

والفئة الثانية تكتب كما في الكود التالي

الكود:: اسم الفئة

والفئة الثالثة تكتب كما في الكود التالي

الكود:: اسم الفئة

وهكذا ...........

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

طريقة تلوين فئات الصفحة الرئيسية كل فئة بلون خاص + الأكواد 312

» كود عدد زوار الصفحة 3
» كود عدد زوار الصفحة 5
» كود عدد زوار الصفحة 2