[ كود ] : الأن أجعل اقســام موقعك + وصف الموقع اكثر جماليه

[اشراق العالمrss]

بســم الله الرحمن الرحيم


كيفكم انشاءالله في احــسن حال

قبل كل شي ^_^

تفضل بزيارة الموقع وشوف المثال لأسم القسـم + وصفه على الطــبيعه

ملتــــــــــقى الأحبة (http://www.awladdz.hyperphp.com/vb/index.php)

الأن نأتي لخطوات التركيب وهي سهله مو محتاجه اي تعــقيـد

1 : من خلال لوحة التحكم للمنتدى اختر من القائمه على اليمين : الأستايلات والقوالب >> البحث بالقوالب

كما هو موضح لك بالصوره

http://www.rawabetvb.net/upload/ef2d6a30681.png

2 : ابحث عن هذا القالب forumhome_forumbit_level2_post

كما هو موضح لك بالصوره

http://www.rawabetvb.net/upload/ef2d6a30682.png

بعد عملية البحث راح يظهر لك القالب كما هو موضح لك بالصورهـ

http://www.rawabetvb.net/upload/96eee6b7143.png

ضغط كلك يسار على نفس اسم القالب مرتين وراح يفتح معانا القالب كما هو موضح لك بالصوره
http://www.rawabetvb.net/upload/ef2d6a30682.png

بعد عملية البحث راح يظهر لك القالب كما هو موضح لك بالصورهـ

http://www.rawabetvb.net/upload/96eee6b7143.png

نضغط كلك يسار على نفس اسم القالب مرتين وراح يفتح معانا القالب كما هو موضح لك بالصوره

http://www.rawabetvb.net/upload/96eee6b7144.png

نحذف الكود الموجود كاملا مع اخذ نسخه احتياطيه منه قبل حذفه ونستبدله بالكود التالي
كود PHP:





$forum[title]
($vbphrase[x_viewing])

$forum[description]


$vbphrase[unsubscribe_from_this_forum]
$vbphrase[subforums]: $forum[subforums]

$forum[lastpostinfo]
$forum[threadcount]
$forum[replycount]

$forum[moderators] 


$childforumbits



الأن انتهيــنا من الخطوه الأولى نأتي للخوطوهـ الثانيه :



من خلال الاستايلات والقوالب >> التحكم بالاستايلات كما هو موضح لك بالصوره

http://www.rawabetvb.net/upload/96eee6b7145.png

نحتار الأستايل المراد التعديل عليه >> ومن القائمه المنسدله نختار css رئيسي كما هو موضح لك بالصوره

http://www.rawabetvb.net/upload/9723e721ce1.png

بعد ما تفتح لنا قوالب الألوان نبحث عن تعاريف CSS الإضافية

تجدها في اخر المتصفح او ما قبل الاخي كما هو موضح لك بالصوره

http://www.rawabetvb.net/upload/9723e721ce2.png

ضع الكود التالي بالمربع الثاني كما هو موضح لك بالصوره الســابقه

كود PHP:
.gi77opa a {
padding: 5px;
margin-top: 10px;
}




.gi77opa a:hover {
color: #069; /* لون الخط اثناء مرور الماوس عليه */
text-align: center;
font-size: 20px;
font-family: Arial, Helvetica, sans-serif;
}






.abumejbel{
background-color:#F2F4F7; /* لون خلفية الوصف */
text-align:right;
padding:5px;
padding-left:5px;
padding-right:5px;
font-family:tahoma;
font-size:8pt;
font-weight:bold;
color:#333333; /* لون الحدود المنقظه */
border-top-width: 1px;
border-right-width: 4px;
border-bottom-width: 1px;
border-left-width: 4px;
border-top-style: dotted;
border-right-style: solid;
border-bottom-style: dotted;
border-left-style: solid;
border-top-color: silver;
border-right-color: silver;
border-bottom-color: silver;
border-left-color: silver;
}


.abumejbel:hover{
background-color:#E9FBFC; /* لون خلفية الوصف بعد مرور المؤشر عليه */
font-weight: bold;
border-top-width: 1px;
border-right-width: 16px;
border-bottom-width: 1px;
border-left-width: 4px;
border-top-style: dotted;
border-right-style: solid;
border-bottom-style: dotted;
border-left-style: solid;
border-top-color: #666;
border-right-color: #666;
border-bottom-color: #666;
border-left-color: #666;
color: #00F; /* لون الخط بعد مرور المؤشر عليه */
}



الأن اعمل حفظ وروح وشوف شكل الأقســام


اتمنى ان الشــرح كان واضح للجميع:D

منقـــــــول للافادة:)1;)