نقلة نوعية في تطوير المنتديات ( درس القوالب المنسدلة )

[Fethi.dz]

السلام عليكم و رحمة الله و بركاته

مؤخرا جلست اعمل على جهازي و بالتحديد على سكريبت vb

عملت على انشاء قالب مشاهذة الموضوع

حيث القالب يجمع كل من الــ postbit ( العرض الافقي) و الــ postbit_lagacy ( العرض العمودي)

و يمكن ان نطلق على هذه الطريقة بالطريقة التردينادية لانها اول مرة شوهد في منتدى ترايدنت التطويري

الجديد في درسي

هو انه قمت بتغير الشكل كلــيا مع اضافة كلا من

1 - برواز للصورة التخصية بحيث يعطي للصورة منظر و رونق جميل
2- اظافة هاك الاوسمة بطريقة منسدلة رائعة و جميلة
3- اظافة بينات الاتصال ايظا بطريقة جميلة و خلابة
4- اضافة هاك اخر مواضيع العضو كالذي موجود هنا و لكن بطريقة منسدلة رائعة

هذا كله في قالب واحد من تطويري

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

و اذا عجبكم راح نتطرق سويا لدرس مفصل كي تطبقه انت ايها العضو بنفسك

و السلام عليكم و رحمة الله و بركاته

[Ooulid Elblade]

اهلا خويا فتحي

منور الجلفة يا ولد عمي

[Fethi.dz]

المشاركة الأصلية كتبت بواسطة Ooulid Elblade

اهلا خويا فتحي

المشاركة الأصلية كتبت بواسطة Ooulid Elblade

منور الجلفة يا ولد عمي

و بك اهلا و مرحبا اخي

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

[الأمير]

موضوع حصري و مميّز أخي فتحي....

شـكــ وبارك الله فيك ـــراً لك ...

[Fethi.dz]

السلام عليكم و رحمة الله و بركاته

ابدأ الدرس على بركة الله

و هو مقسم الى جزئين



الجزء الاول


طريقة انشاء جدول و برواز حول الصورة الشخصية للعضو

أولا نفتح قالب postbit او قالب الـ postbit lagacy

و نبحث عن الجملة الشرط التالي و الخاصة بإضهار الصورة الرمزية للعضو

 <if condition="$show['avatar']"><td class="alt2"><a href="member.php?$session[sessionurl]u=$post[userid]"><img src="$post[avatarurl]" $post[avwidth] $post[avheight] alt="<phrase 1="$post[username]">$vbphrase[xs_avatar]</phrase>" border="0" /></a></td></if>

حسنا بعد ذلك نفتح الفرونت بيج او ي اي برنامج يدعم php

الان نريد ان نظع الجملة السابقة داخل مربع و برواز جميل مع خلفية مصورة

كيف ؟؟

أولا نقوم بوضع جدول مع صورة خلفية للجملة السابقة

و جملة بداية الجدول تبدأ بــ <table> و تنتهي بي <table/>

حسنا هناك خيرات مصحوبة مع الجدول توضع كالتالي

<table bgcolor="#E7E7E7" class="tborder" width="20" style="border-collapse: collapse; background-position:   center top; background-image:url('Fethi.dz-style/misc/icon/avat-bg.gif'); background-repeat:repeat-x" id="table3" cellpadding="6" align="center">

بحيث
bgcolor="#E7E7E7" هي خلفية الجدول وانا اخترت لون رمادي فاتح...

width="20" هو عرض الجدول ( هنا نترك القيمة 20 بحيث ان الجدول اقل حد له عشرون و سيتمدد كل ما تكون الصورة و حسب اعدادات المنتدى )...

background-image:url('Fethi.dz-style/misc/icon/avat-bg.gif') هنا هو امر الذي يستدعي الصورة التي ستوضع خلفية للجدول...

***ملاحظة: الصورة حجمها يجب ان يكون 1 للعرض و 170 للارتفاع

حيث ستصبح جملة الامر هكذا

<if condition="$show['avatar']"><td class="alt2">

 
<table bgcolor="#E7E7E7" class="tborder" width="20" style="border-collapse: collapse; background-position:   center top; background-image:url('Fethi.dz-style/misc/icon/avat-bg.gif'); background-repeat:repeat-x" id="table3" cellpadding="6" align="center">

<a href="member.php?$session[sessionurl]u=$post[userid]"><img src="$post[avatarurl]" $post[avwidth] $post[avheight] alt="<phrase 1="$post[username]">$vbphrase[xs_avatar]</phrase>" border="0" /></a> 
</table>
</td>
</if>

هذه المرحلة الاولى نأتي الى المرحلة الثانية

انشاء برواز للجدول الذي انشاناه ( حدود بلون معين)

ناتي بعد امر <table>

نظع امر <td>

و هذا هو الامر الخاص بإنشاء البرواز للجدول و التي باللون الرمادي الغامق

<td style="border-style: solid; border-width: 1px; padding-left: 6px; padding-right: 6px; padding-top: 6px; padding-bottom: 4px" bordercolor="#bababa">

و ينتهي هذا الامر دوما بــ <tb/>

الامر border-style: solid لتحديد نوع الخط

solid خط مستقيم

dashesd خط متقطع

الامر bordercolor="#bababa لتحديد لون الخط

سيصبح في النهاية الكود كامل متكامل للصورة الرمزية للعضو مع خلفية عبارة عن صورة و بوردر باللون الذي تريده

الكود النهائي سيكون بهذا الشكل

<if condition="$show['avatar']"> 
<td class="alt2">
<table bgcolor="#E7E7E7" class="tborder" width="20" style="border-collapse: collapse; background-position:   center top; background-image:url('Fethi.dz-style/misc/icon/avat-bg.gif'); background-repeat:repeat-x" id="table3" cellpadding="6" align="center">
<tr>
<td style="border-style: solid; border-width: 1px; padding-left: 6px; padding-right: 6px; padding-top: 6px; padding-bottom: 4px" bordercolor="#bababa">
<div align="center">
<a href="member.php?$session[sessionurl]u=$post[userid]">
<img src="$post[avatarurl]" $post[avwidth] $post[avheight] alt="<phrase 1="$post[username]">$vbphrase[xs_avatar]</phrase>" border="0" /></a>
</div>
</td>
</tr>
</table>
</td>
</if>

هذا شكل توضيحي لما سيبدو عليه العمل الذي قمنا به






ان شاء الله الدرس يكون سهل

و ان شاء الله يكون هناكــ تجاوب لاكمل الجزء التاني من الدرس

القوالب المنسدلة


مع التحية

[Fethi.dz]

المعذرة على القصور

و هذا الدرس كامل

اعتذر عدم تكملة الشرح


اقدم لكــم هدية حصريــة


لقالب الــ postbit_lagacy


و الذي الكل كان ينتظره بفارغ الصبر


قالب مطور مع خيارات منسدلة للأوسمة و قائمة الاتصال و اخر مواضيع العضو و خلفية للصورة الرمزية



الهاكات المستخدمة:


*هاك الاوسمة
*هاك اخر المواضيع للعضو
*هاك اخر تواجد للعضو


التركيب :


1 - قم بإستبدال محتوى Postbit_lagacy في الاستايل المستخدم في منتداك بالكود المرفق


2- قم بتحميل ملف icon على الامتداد التالي في FTP
vb/images/icon



صورة توضيحية






للتحميـــــــــل

القالب


الصور


و مبروك عليكم القالب الجديد




و انتظرو مني المزيد ان شاء الله

[حويشي2008]

الله يبارك اخي فتحي استاذنا الكبيررررررررررررر

تقبل مروري

[ايت محمد]

باركـ الله فيك اخوي فتحي

[Yassine_Dz]

جزاك الله خيرا أخ فتحي ... ممتاز واصل إبداعاتك

بارك الله فيك

[korabika87]

فكرة رااااااااااااائعة

[Yassine_Dz]

السلام عليكم و رحمة الله وبركاته

أنا أملك منتدى طبي (باللغة الفرنية) نسخة المنتدى هي 3.8.2 ، أريد أن أضع قالب postbit_legacy ... خاصا
يكون على الجهة اليسرى طبعا ، و متوافق مع اللغة الفرنسية

يحتوي على المعلومات التالية:

تاريخ التسجيل: بالفرنسية يعني: Inscrit le
عدد المواضيع: بالفرنسية: Messages
الجنس: بالفرنسية: Sexe
مستوى الدراسة: بالفرنسية: Niveau d'etude
الكلية: بالفرنسية: Faculté
و النقاط: بالفرنسية: Points

جزاكم الله خيرا .. في انتظار مساعداتكم

رابط المنتدى (آسف إذا كان ممنوعا وضع الرابط)
www.medecine.eb2a.com


بارك الله فيكم

[RiADATVENT]

مشكور أخي فتحي على هدا الدعم الدي تقدمه للأعضاء موفقين انشاء الله

[mouhab_23]

مشكور يا أخي وبارك الله فيك

[الـ^ـسَّــآآحِـ^ــرْ ،]

بارك الله فيك