هاك المتواجدون بالمربعات والالوان

- يكون اسم العضو داخل مربع وبلونه المخصص في أي مكان يظهر فيه اسمه في المنتدى
2- عمل خلفية صور موحدة للمربعات أو تحديد خلفيات مختلفة لكل مجموعة
3- تحديد لون مخصص لكل مجموعة
4- يمكن إضافته بسهولة لكل استايل جديد
هذه بعض الصور للتوضيح:
1- صورة للذين تواجدوا اليوم :

كود PHP:

[margin: 0px 0px 0px 0px;  width:48;  border: 2px solid #FF1515;  cursor: pointer;  font-family:MS Sans Serif;  font-size:10px;  vertical-align:middle;  letter-spacing:0;  color:#FF1515;  padding-left:0;  padding-right:0;  padding-top:0;  padding-bottom:0;  background-color:#FFE3DF;  background-image: url('altaer/color_bg.gif');  text-align:center; }  .green  {  margin: 0px 0px 0px 0px;  width:48;  border: 2px solid #006600;  cursor: pointer;  font-family:MS Sans Serif;  font-size:10px;  vertical-align:middle;  letter-spacing:0;  color:#006600;  padding-left:0;  padding-right:0;  padding-top:0;  padding-bottom:0;  background-color:#FFE3DF;  background-image: url('altaer/color_bg.gif');  text-align:center; }  .blue  {  margin: 0px 0px 0px 0px;  width:48;  border: 2px solid #0000FF;  cursor: pointer;  font-family:MS Sans Serif;  font-size:10px;  vertical-align:middle;  letter-spacing:0;  color:#0000FF;  padding-left:0;  padding-right:0;  padding-top:0;  padding-bottom:0;  background-color:#FFE3DF;  background-image: url('altaer/color_bg.gif');  text-align:center; }  .gray  {  margin: 0px 0px 0px 0px;  width:48;  border: 2px solid #CCCCCC;  cursor: pointer;  font-family:MS Sans Serif;  font-size:10px;  vertical-align:middle;  letter-spacing:0;  color:#CCCCCC;  padding-left:0;  padding-right:0;  padding-top:0;  padding-bottom:0;  background-color:#FFE3DF;  background-image: url('altaer/color_bg.gif');  text-align:center; }  .fushia  {  margin: 0px 0px 0px 0px;  width:48;  border: 2px solid #FF66CC;  cursor: pointer;  font-family:MS Sans Serif;  font-size:10px;  vertical-align:middle;  letter-spacing:0;  color:#FF66CC;  padding-left:0;  padding-right:0;  padding-top:0;  padding-bottom:0;  background-color:#FFE3DF;  background-image: url('altaer/color_bg.gif');  text-align:center; }  .orang  {  margin: 0px 0px 0px 0px;  width: 48;  border: 2px solid #FF9900;  cursor: pointer;  font-family:MS Sans Serif;  font-size:10px;  vertical-align:middle;  letter-spacing:0;  color:#FF9900;  padding-left:0;  padding-right:0;  padding-top:0;  padding-bottom:0;  background-color:#FFE3DF;  background-image: url('altaer/color_bg.gif');  text-align:center  }  .teal  {  margin: 0px 0px 0px 0px;  width: 48;  border: 2px solid #008080;  cursor: pointer;  font-family:MS Sans Serif;  font-size:10px;  vertical-align:middle;  letter-spacing:0;  color:#008080;  padding-left:0;  padding-right:0;  padding-top:0;  padding-bottom:0;  background-color:#FFE3DF;  background-image: url('altaer/color_bg.gif');  text-align:center; }  .brown  {  margin: 0px 0px 0px 0px;  width: 48;  border: 2px solid #BF0000;  cursor: pointer;  font-family:MS Sans Serif;  font-size:10px;  vertical-align:middle;  letter-spacing:0;  color:#BF0000;  padding-left:0;  padding-right:0;  padding-top:0;  padding-bottom:0;  background-color:#FFE3DF;  background-image: url('altaer/color_bg.gif');  text-align:center; }  .pink  {  margin: 0px 0px 0px 0px;  width: 48;  border: 2px solid #CC33FF;  cursor: pointer;  font-family:MS Sans Serif;  font-size:10px;  vertical-align:middle;  letter-spacing:0;  color:#CC33FF;  padding-left:0;  padding-right:0;  padding-top:0;  padding-bottom:0;  background-color:#FFE3DF;  background-image: url('altaer/color_bg.gif');  text-align:center; }  .black  {  margin: 0px 0px 0px 0px;  width: 48;  border: 2px solid #000000;  cursor: pointer;  font-family:MS Sans Serif;  font-size:10px;  vertical-align:middle;  letter-spacing:0;  color:#000000;  padding-left:0;  padding-right:0;  padding-top:0;  padding-bottom:0;  background-color:#FFE3DF;  background-image: url('altaer/color_bg.gif');  text-align:center; }  .white  {  margin: 0px 0px 0px 0px;  width: 48;  border: 2px solid #ffffff;  cursor: pointer;  font-family:MS Sans Serif;  font-size:10px;  vertical-align:middle;  letter-spacing:0;  color:#ffffff;  padding-left:0;  padding-right:0;  padding-top:0;  padding-bottom:0;  background-color:#FFE3DF;  background-image: url('altaer/color_bg.gif');  text-align:center; } 


</div>

ثم أعمل حفظ من اسفل - صورة (4)

صورة (4)

===============

خطوة (2)

1- اذهب لخيار ( المجموعات ) ثم ( ضبط إعدادات مجموعة الأعضاء ) - صورة (5)

صورة (5)

2- أضغط ( اذهب ) على خيار ( تعديل المجموعة ) - صورة (6)

صورة (6)

3- اضف الكود التالي على مرحلتين - صورة (7)

صورة (7)

ضع code1 في مربع النص الأول - صورة (7)

code1: [ مهم: يجب تغيير كلمة ( red ) لكل مجموعة مثال (green - blue - pink ) ]

type="text" name="T1" size="17" class="red" value="






code2 في مربع النص الثاني - صورة (7)

readonly style="width: 90">

ثم أضغط على زر ( تحديث ) في الاسفل - صورة (8)

صورة (8)

===================

خطوة (3)

1- عمل تحديث للعدادات كما هو موضح في صورة (9) وصورة (10) وصورة (11)

صورة (9)

صورة (10)

صورة (11)

===================

التعديلات التي يمكنك عملها:

صورة (12)

صورة (13)

==========================

1- كود حجم المربع : ( width: 48; ) - صورة (12) تحديد (1)

1- كود نوع الخط : ( font-family:MS Sans Serif; ) - صورة (12) تحديد (2)

3- كود لون خلفية المربع : ( background-color:#FFE3DF; ) - صورة (12) تحديد (3)

4- كود لون النص داخل المربع : ( color:#ffffff; ) - صورة (12) تحديد (4)

5- كود صورة الخلفية للمربع : ( background-image: url('altaer/color_bg.gif'); ) - صورة (12) تحديد (5)

6- كود اللون الخاص بالمجموعة في خطوة (2) مهم جدا : ( class="red" ) صورة (13) تحديد (1)

استبداله باسم المجموعة الخاصة بالكود المراد استخدامه لمجموعة المستخدمين في خطوة (2) عند ( code1 )

---------------------

ملحوظة : مجموعات الألوان كالتالي:

.red = أحمر - .green = أخضر - .blue = أزرق - .gray = رمادي - .fushia = فوشي

.orang = برتقالي - .brown = بني - .pink = بنفسج - .black = اسود - .white = أبيض

ودمتم سالمين

عطاء مميز وحضور انيق ووفاء لكيان روايه

التمسه في متصفح الوفاء

راقني ماكان هنا وانتظر مزيدك

فكل الشكر والامتنان لهكذا هطل


دمت بكل الخير

منوره لا خلا ولا عدم

طرح بقمة الروووعه
تسلم أيدكِ ع الطرح المميز لاعدمنـآك ,...
بانتظارجديدك بكل شوق

\\ // \\ ينطيكك الف عافيه ع الموشاركه اللؤلؤيه حلوة الروح

يعطيك العافيه ياارب..
ولك مني باقات من القرنفل
تحمل في شذاها اسمى معاني الاحترام
بانتظارجديدك بكل شوق