المساعد الشخصي الرقمي

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



admin
10-31-2013, بتوقيت غرينيتش 04:47 AM
http://www.dzbatna.com/images/icons/iconrote.gif ط§ظ„ط£ظ† ط£ط¬ط¹ظ„ ط§ظ‚ط³ظ€ظ€ط§ظ… ظ…ظˆظ‚ط¹ظƒ + ظˆطµظپ ط§ظ„ظ…ظˆظ‚ط¹ ط§ظƒط«ط± ط¬ظ…ط§ظ„ظٹظ‡ (http://www.dzbatna.com/t1771650/)



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


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

قبل كل شي ^_^

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

منتديات تيماء (http://www.gi77op.com/vb)

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

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

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

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







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

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


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





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

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




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


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




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



رمز PHP:

<code style="white-space:nowrap"> <code> <tr align="center">
<td class="alt2"><img src="$stylevar&#91;imgdir_statusicon&#93;/$forum&#91;imageprefix&#93;forum_$forum&#91;statusicon&#93;.gif" alt="" border="0" id="forum_statusicon_$forum&#91;forumid&#93;" /></td>
<td class="alt1Active" align="$stylevar&#91;left&#93;" id="f$forum&#91;forumid&#93;">
<div>
<div class="gi77opa">
<a href="forumdisplay.php?$session&#91;sessionurl&#93;f=$forum&#91;foru mid&#93;"><strong> $forum&#91;title&#93;</strong></a>
<if condition="$show&#91;'browsers'&#93;"><span class="smallfont">(<phrase 1="$forum&#91;browsers&#93;">$vbphrase&#91;x_viewing&#93;</phrase>)</span></if>
</div></div>
<if condition="$show&#91;'forumdescription'&#93;"><div class="abumejbel">$forum&#91;description&#93;</div>

</div></if>
<if condition="$show&#91;'forumsubscription'&#93;"><div class="smallfont"><strong><a href="subscription.php?$session&#91;sessionurl&#93;do=removesubs cription&amp;f=$forum&#91;forumid&#93;" rel="nofollow">$vbphrase&#91;unsubscribe_from_this_forum&#93;</a></strong></div></if>
<if condition="$show&#91;'subforums'&#93;"><div class="smallfont" style="margin-top:$stylevar&#91;cellpadding&#93;px"><strong>$vbphrase&#91;subforums&#93;</strong>: $forum&#91;subforums&#93;</div></if>
</td>
<td class="alt2">$forum&#91;lastpostinfo&#93;</td>
<td class="alt1">$forum&#91;threadcount&#93;</td>
<td class="alt2">$forum&#91;replycount&#93;</td>
<if condition="$vboptions&#91;'showmoderatorcolumn'&#93;">
<td class="alt1"><div class="smallfont">$forum&#91;moderators&#93;&nbsp;</div></td>
</if>
</tr>
$childforumbits
</code> </code>

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



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

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






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


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





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

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


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


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


رمز PHP:

<code style="white-space:nowrap"> <code> .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; /* لون الخط بعد مرور المؤشر عليه */
}
</code> </code>



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


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


اثناء النقل ارجو ذكر المصــدر

روابط في بي (http://www.rawabetvb.com/vb/showthread.php?p=1476283#post1476283)

اخوكم ابو ميــار







ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)



https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©

استعمل مربع البحث في الاسفل لمزيد من المواضيع


سريع للبحث عن مواضيع في المنتدى