vBulletin Club - التصميم الاحترافي للمنتديات ( درس عملي تطبيقي )

التصميم الإحترافي للمنتديات منقول من vbulletinclub


		#1	25 - 04 - 2003 ، 10:33

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

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

بداية نقوم بتحميل الملف الموجود في هذا الموضوع بالضغط هنـــــــــــــــــــــا
عنوان الموضوع http://www.vbulletinclub.com/showthread.php?postid=5896#post5896
نفتح الملف ببرنامج paint Shop Pro أو Photshop و نقوم بتغيير لون الأرضية إلى اللون المناسب ...
كما يمكننا تغير ألوان الإطارات حسبما نريد حيث يوجد في الحافظة تخطيط الإطار الرئيسي محفوظ ..

ثم نضيف ضمن المستطيل الداخلي مربعاً مستطيل الشكل ليكون بمثابة المساحة التي يظهر فيها اسم العضو و بياناته و الأفاتار و غير ذلك ..
فيظهر معنا الشكل النهائي تقريباً كمايلي :

لاحظ أنك حين تحفظ الصورة بامتداد png فإن حجمها لن يتجاوز 11 كيلو بايت .. ( اضغط هنا للمعاينة )
في حين لو حفظتها بامتداد jpg فإن حجمها سيرتفع إلى 17 كيلو بايت ( اضغط هنا للمعاينة )
فيما لو حفظتها بامتداد gif فإن حجمها سيزداد إلى 61 كيلو بايت ( اضغط هنا للمعاينة )

و الآن انتهينا من الخطوة الأولى للنتقل إلى الخطوة الثانية و هي تقطيع الصورة إلى أجزاء مناسبة.

التوقيع

الحمدُ للهِ الذي أنزلَ على عبدِهِ الكتابَ و لم يجعل لهُ عِوَجاً

أفضل أن تسأل 100 مرة من أن تخطئ مرة

حساب الماسينجر mared@ntl.ru
تنبيه هام : إن توزيع أي ملف من ملفات النادي لأي جهة أو شخص غير مشترك في النادي و بأي شكل أو سبب ، سيعرضك لفقدان عضوية النادي و دون أي إنذار ..
أنصح بزيارة هذا الموقع الجديد

آخر تعديل alkahf يوم 02 - 12 - 2003 في 02:20.

alkahf

إداري

الستايل المعتمد : Royal1


		#2	25 - 04 - 2003 ، 11:45

الجزء الثاني

ما الحاجة لتجزئة الصورة ؟
الصورة هي التي ستحيط بمواد صفحة الإنترنت ، و بما أن لكل صورة طول و عرض ثابت لا تغير ...

و لكن طبيعة صفحات الإنترنت تتطلب أن يكون التصميم مرناً بالحد الكافي كي تتمدد عرضاً و ارتفاعاً بمقدار مقياس دقة الشاشة لدى المتصفح و كذلك بمقدار حجم المواد التي تحتويها صفحة الإنترنت ..

و فيما يتعلق ببرامج المنتديات فإن المواضيع تختلف في عدد كلماتها ، فمنها ما يكون طول الموضوع 100 حرف ، و منها ما يتكون من عشرات الألوف من الحروف ، و لذلك يجب تجزئة الصورة التي ستحيط بالنصوص المكتوبة لتظهر بنفس الشكل الواحد لكافة أنواع النصوص المكتوبة على اختلاف أعدادها و أحجامها ..

ولتجزئة الصورة بشكل احترافي علينا أن نتعرف على أجزائها المتنوعة ، فللصورة 3 أجزاء يمكن تفريقها كمايلي :

الجزء الأول : الأجزاء الثابتة ( و تعني الأجزاء التي لا يمكن الاستغناء عنها بجزء صغير بل يجب أن تبقى ثابتة في الشكل و المقياس و الحجم )

الجزء الثاني : الأجزاء القابلة للتمديد و الاستعاضة ( و نقصد بها الأجزاء التي يمكن الاستعاضة عنها بجزء صغير من الصورة ليحل مكان مساحة كبيرة بطريقة التعويض أو التكرار )

الجزء الثالث : الأجزاء القابلة للاستعاضة بالألوان الرقمية ( و نقصد بها تلك الأجزاء و الأسطح التي يمكن الاستغناء عنها و نضع بدلاً منها كود هتمل باللون البديل عنها )

و الآن .. نراقب هذا الشكل :

نجد في هذا الشكل ثمانية أجزاء ثابتة ، و قد قمنا بتأطيرها بإطار أسود اللون ... و هذه الأجزاء ينبغي أن تبقى كما هي بنفس الشكل و الحجم ...

كما نجد في نفس الشكل ثمانية أجزاء قابلة للتمديد ، و قد قمنا بتأطيرها بإطار أحمر اللون ، و هذه الأجزاء يمكن أن نأخذ كل منها و نستعيض به كأرضية صغيرة قابلة للتكرار لتحل مكان المساحة الطويلة التي قمنا بالإشارة إليها بواسطة الأسهم المتصلة ..

أما الأجزاء الباقية و التي أشرنا إلى ( بعضها ) بإطارات خضراء اللون ، فهي الأجزاء التي يمكن إلغاءها و الاستعاضة عنها بلون رقمي بلغة هتمل .. مثال #F8E1BA للمربع رقم 1 و كذلك #F2CA8A للمربع رقم 2 .

و الآين يمكن لكل منكم القيام بتجزئة الصورة كما أشرنا في التفصيلات أعلاه .. ثم تجميعها في صفحة هتمل ..
حسب ترتيبها ...
و سنقدم في الجزء التالي شرحاً مبسطاً لهذا الأمر ..

التوقيع

الحمدُ للهِ الذي أنزلَ على عبدِهِ الكتابَ و لم يجعل لهُ عِوَجاً

أفضل أن تسأل 100 مرة من أن تخطئ مرة

آخر تعديل alkahf يوم 02 - 12 - 2003 في 02:21.

alkahf

إداري

الستايل المعتمد : Royal1


		#3	25 - 04 - 2003 ، 15:09

لتقطيع باستخدام برنامج Dicer039

كما أسلفنا في موضوع سابق أن هذا البرنامج [ Dicer039 ] لايعمل إلا في ويندوز ميلينيوم أو ويندوز 98 ..

############################
ملاحظة : تم الحصول على برنامج لتقطيع الصور يعمل في ويندوز XP و تجد نسخة منه في هذا الموضوع http://www.vbulletinclub.com/showthread.php?postid=6573#post6573
و شكراً للأخ graetxp
############################

لذلك فإن الذين لايستخدمون ويندوز 98 أو ميلينيوم في أجهزتهم فلن يستطيعوا الاستفادة من هذا البرنامج ، و لكن توجد أمامهم ثلاثة طرق لتجاوز هذه المشكلة :

الطريقة الأولى : تركيب ويندوز ميلينيوم في نفس الجهاز مع ويندوز إكس بي ( علماً أنه يمكن تركيب هذين النوعين معاً في جهاز واحد بشرطين ) : الشرط الأول : أن يكون في جهازك قرصين صلبين ، أو قرص واحد مقسوم إلى جزئين . الشرط الثاني : أن يتم تركيب ميلينيوم أولاً ثم تفتح ويندوز ميلينيوم و تضع قرص CD ويندو إكس بي في محرك الأقراص و تختار التركيب نسخة كاملة و تحدد مكانها على القرص الصلب الثاني D مثلاً ..

الطريقة الثانية : البحث عن برنامج آخر للتقطيع يدعم ويندوز إكس بي ..

الطريقة الثالثة : تقطيع الصور بشكل يدوي

و نبدأ الآن بطريقة التقطيع :

1 ـ نفتح البرنامج بالضغط على أيقونة Dicer فتظهر لنا واجهة البرنامج ، تضغط على كلمة File > Open
ثم تقوم بتحديد الصورة التي تريد تقطيعها و تضغط فتح .( ملاحظة : هذا البرنامج يفتح فقط الصور بامتداد gif , jpg فقط )

حين تفتح الصورة يطلب منك تحديد أول 4 أحرف من اسم الصور عند التقطيع ..

2 ـ بالماوس تستطيع تحديد الأجزاء التي تريد تقطيعها ، حيث زر الماوس الأيمن يقوم بتحديد ( خط التقطيع الأفقي ) فيما زر الماوس الأيسر يقوم بتحديد ( خط التقطيع العمودي ) .

و تقوم بالتحديد كما يظهر في هذا الشكل :

إذا حصل و أخطأت في تحديد خط التقطيع يمكنك الضغط مرة أخرى فوق الخط الخاطئ ( تماماً ) بالماوس ليختفي ..

3 ـ تضغط File > Process Image

فيبدأ البرنامج بتقطيع الصورة حسب التحديدات التي قمت باختيارها ...

4 ـ سؤال : أين يتم حفظ الصور التي تم تقطيعها ؟
الجواب : يتم حفظها في نفس المجلد الذي توجد فيه الصورة الأساسية ، مع إضافة ملفين اثنين هما :
ـ ملف HTML يوجد فيه الصورة بعد التقطيع مع كود هتمل الذي يجمعها ..
ـ ملف Styl.grd هذا الملف يحتفظ بالمعلومات لحدود التقطيع التي قمت باختيارها ...

5 ـ تفتح ملف HTML بواسطة فرونت بيج و تستطيع تعديل ما تراه مناسباً من حذف و تعديل و غير ذلك ..

6 ـ في حال وجدت أن التقطيع خاطئ و لا يتناسب مع ماتريده أنت ، فيمكنك إعادة فتح البرنامج و فتح الصورة ثم الضغط على File > Load Grid

فتظهر أمامك نافذة لتحديد مكان الملف Styl.grd

فتقوم بتحديد مكان الملف و تضغط ok ليظهر أمامك مخطط تقطيع الصورة القديم و تقوم بالتعديلات المناسبة ....

ملاحظة : في الملف المرفق تجد الصورة بعد التقطيع مع ملف هتمل و ملف grd يمكنك أن تستفيد منها للمقارنة فقط ...

( أرجو لكم الآن تقطيعاً هنيئاً )

و إلى اللقاء في الجزء التالي ..
و السلام عليكم

عماد الدين

الملفات المرفقة

style1.zip الحجم :(43 بايت ، مرات التحميل : 48 قراءة)

التوقيع

الحمدُ للهِ الذي أنزلَ على عبدِهِ الكتابَ و لم يجعل لهُ عِوَجاً

أفضل أن تسأل 100 مرة من أن تخطئ مرة

آخر تعديل alkahf يوم 02 - 12 - 2003 في 02:22.

alkahf

إداري

الستايل المعتمد : Royal1


		#4	25 - 04 - 2003 ، 17:03

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

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

الملفات المرفقة

html.zip الحجم :(1 بايت ، مرات التحميل : 68 قراءة)

التوقيع

الحمدُ للهِ الذي أنزلَ على عبدِهِ الكتابَ و لم يجعل لهُ عِوَجاً

أفضل أن تسأل 100 مرة من أن تخطئ مرة

alkahf

إداري

الستايل المعتمد : Royal1


		#5	25 - 04 - 2003 ، 17:21

الخطوة التالية

1 ـ افتح الملف style.html و قم بتعديل كافة روابط الصور من "stylxxx.jpg" إلى "images/stylxxx.jpg"

2 ـ ترفع ملفات الصور إلى المجلد vb/images

3 ـ تدخل لوحة التحكم إلى : [ Styles > Add Style ] فيظهر لديك عدة خيارات ، تقوم بكتابة مايلي في الخيار الأعلى : style
ثم تضغط Save دون أي تعديل في الخيارات الباقية ..

4 ـ تدخل لوحة التحكم إلى [ Styles > Modify > Style > fonts/colors/etc ]
تبحث عن النافذة التي اسمها : [ Header ]

تحذف منها مايلي :

كود PHP:

<table bgcolor="{pagebgcolor}" width="{tablewidth}" cellpadding="10" cellspacing="0" border="0"> <tr> <td>

و تضع بدلاً منه مايلي :

كود PHP:

5 ـ في نفس الصفحة تبحث عن النافذة التي اسمها Footer .
و تحذف منها مايلي :

كود PHP:

</td> </tr> </table>

و تضع بدلاً منه مايلي :

كود PHP:

</td> </tr> </table> </TD><TD background="images/styl015.jpg"> </TD></TR><TR><TD><IMG SRC = "images/styl040.jpg" WIDTH = 21 HEIGHT = 44></TD><TD><IMG SRC = "images/styl041.jpg" WIDTH = 35 HEIGHT = 44></TD> <TD width="100%" background="images/styl043.jpg" dir="rtl"> </TD><TD><IMG SRC = "images/styl045.jpg" WIDTH = 21 HEIGHT = 44></TD><TD><IMG SRC = "images/styl046.jpg" WIDTH = 10 HEIGHT = 44></TD><TD><IMG SRC = "images/styl047.jpg" WIDTH = 29 HEIGHT = 44></TD></TR> </TABLE>

6 ـ تبحث عن الخانة التي اسمها : Body Tag و تضع لون الأرضية

كود PHP:

bgcolor="#FBEED3"

بدلا من القديم

7 ـ تبحث عن الخانة التي اسمها : Page Background Color و تحذف الكود الموجود فيها و تضع بدلا منه الكود التالي :

كود PHP:

#FFECD6

7 ـ تضغط الزر Save Changes

8 ـ تذهب إلى المنتدى فتجد أن التصميم تم تغييره إلى الشكل المطلوب ..

و إلى اللقاء في الجزء التالي

و السلام عليكم

عماد الدين

التوقيع

الحمدُ للهِ الذي أنزلَ على عبدِهِ الكتابَ و لم يجعل لهُ عِوَجاً

أفضل أن تسأل 100 مرة من أن تخطئ مرة

alkahf

إداري

الستايل المعتمد : Royal1


		#6	26 - 04 - 2003 ، 16:06

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

اضغط هنا لرؤية مثال تطبيقي على هذا الدرس وسوف نتابع تطبيق الخطوات القادمة هناك بإذن الله

التوقيع

الحمدُ للهِ الذي أنزلَ على عبدِهِ الكتابَ و لم يجعل لهُ عِوَجاً

أفضل أن تسأل 100 مرة من أن تخطئ مرة

alkahf

إداري

الستايل المعتمد : Royal1


		#7	02 - 05 - 2003 ، 15:24

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

تجهيز شكل المواضيع .. postbit

1 ـ قم بتحميل الملف المرفق و تفكيكه و تابع معنا هذه الخطوة بهدوء و تركيز شديد ..
ستجد داخل المجلد ملفين باسم :
table.html
postbit.txt
---------------

2 ـ لدينا من الدرس السابق ملف اسمه STYL.HTM يجب أن نفتحه و نقوم بحذف كل ماهو زائد فيه ليبقى لدينا فقط الصندوق الصغير الداخلي الخاص باسم العضو ليظهر لدينا على الشكل الذي تراه في الملف الجديد الذي اسمه : table.html

-------------
3 ـ نفتح الآن الملف القديم الذي اسمه style.html و يجب أن نضيف إليه في داخله ( الجانب الأيمن ) ماهو موجود في الملف table.html
ثم ندخل لوحة تحكم المنتدى و نفتح تمبليت
Postbit Templates [expand] > postbit > edit
ونلضق محتوياته ضمن ملف تكست ثم نأخذ منه كافة الروابط و الأكواد و نضيفها إلى الملف style.html بترتيب شديد و حذر ..
فيظهر معنا في النهاية كما ترى في الملف الجديد الذي اسمه postbit.txt

-------------
4 ـ تحذف كل شيء في تمبليت postbit و تضغ فيه محتويات الملف postbit.txt و تحفظ التعديل ..
ثم تذهب إلى المنتدى لترى المواضيع ستظهر كما في هذا العنوان :
http://test.vbulletinclub.com/showthread.php?postid=18#post18

طبعا كما نلاحظ في العنوان أن صفحة المواضيع صارت تحتوي على إطارين ..
و سنتكلم في الجزء التالي عن طريقة حذف الإطار الخارجي بإذن الله ..

و السلام عليكم

أرجو طرح الأسئلة في موضوع
أسئلة بخصوص موضوع التصميم الاحترافي للمنتديات بالضغط هنا

الملفات المرفقة

styl1.zip الحجم :(10 بايت ، مرات التحميل : 38 قراءة)

التوقيع

الحمدُ للهِ الذي أنزلَ على عبدِهِ الكتابَ و لم يجعل لهُ عِوَجاً

أفضل أن تسأل 100 مرة من أن تخطئ مرة

alkahf

إداري

الستايل المعتمد : Royal1


		#8	15 - 05 - 2003 ، 13:23

الخطوة الخامسة

لاننسى أن بعض الملاحظات المفيدة يمكن أن تجدها على هذا العنوان بخصوص هذا الدرس ..أسئلة بخصوص موضوع التصميم الاحترافي للمنتديات اضغــــــــــط هنـــــــــا

و الآن ننتقل للخطوة الخامسة المتعلقة بإزالة الجدول الزائد الذي يظهر في صفحة المواضيع ..
هذا الخلل يمكن تصحيحه من خلال التعديل في تمبليت :
[ Show Thread Templates > expand > showthread > edit ]
نفتح هذا التمبليت و نبحث عن كلمة

$header

و نحذفها و نضع بلدلاً منها ماهو موجود في تمبليت [ header ] من بداية التمبليت في الأعلى و لغاية

فقط أي نضع مايلي :

<center>
<table border="0" width="100%" cellpadding="0" cellspacing="0">
<tr>
<td valign="top" align="right" background="gold/menu_background.gif"><a href="index.php?s=$session[sessionhash]"><img src="gold/vBulletin_logo.gif" border="0" alt="$bbtitle"></a></td>
<td valign="bottom" align="left" nowrap background="gold/menu_background.gif">

<a href="usercp.php?s=$session[sessionhash]"><img src="gold/top_profile.gif" alt="هنا تستطيع عرض المواضيع المشترك فيها، التعامل مع الرسائل الخاصة، وتعديل ملفك الشخصي وخياراتك" border="0"></a>
<a href="register.php?s=$session[sessionhash]&action=signup"><img src="gold/top_register.gif" alt="التسجيل مجاني" border="0"></a>
<a href="calendar.php?s=$session[sessionhash]"><img src="gold/top_calendar.gif" alt="التقويم" border="0"></a>
<a href="memberlist.php?s=$session[sessionhash]"><img src="gold/top_members.gif" alt="بحث عن أعضاء آخرين" border="0"></a>
<a href="misc.php?s=$session[sessionhash]&action=faq"><img src="gold/top_faq.gif" alt="الأسئلة الأكثر تكرارً" border="0"></a>
<a href="search.php?s=$session[sessionhash]"><img src="gold/top_search.gif" alt="البحث في المنتدى" border="0"></a>
<a href="index.php?s=$session[sessionhash]"><img src="gold/top_home.gif" alt="الصفحة الرئيسة" border="0"></a>
<a href="member.php?s=$session[sessionhash]&action=logout"><img src="gold/top_logout.gif" alt="تسجيل الخروج" border="0"></a>
 

</td>
</tr>
</table>

كما نبحث في تمبليت showthread عن كلمة

$footer

و نحذفها و نضع بدلاً منه جزء من تمبليت footer وهو

<p align="center">
<normalfont><b>< <a href="$contactuslink">المراسلة</a> - <a href="$homeurl">$hometitle</a>
 ></b></normalfont>
</p>

<p align="center"><smallfont>

باستخدام : vBulletin Version $templateversion Copyright ©2000 - 2003, Jelsoft E. Ltd.<br>

$copyrighttext
</smallfont></p>

ثم نحفظ التعديل و نذهب الآن إلى صفحة المواضيع فنجدها كما يلي :
http://test.vbulletinclub.com/showthread.php?s=&threadid=13

و تظهر الآن مشكلة ( أو ليست مشكلة بالمعنى الصحيح ) و لكنه مظهر غير مناسب ألا و هو هذا الشكل

و تعديل هذا الشكل يتم أيضاً من نفس التمبليت showthread

نأخذ من هذا التمبليت الجزء التالي :

<table bgcolor="#FEF5EB" width="100%" cellpadding="0" cellspacing="0" border="0">
<tr><td width="10"><img width="10" height="1" src="gold/space.gif" alt=""></td><td width="100%">


$poll


<div align="center">
<center>
<table cellpadding="2" cellspacing="0" border="0" width="96%">
<tr>
<td><smallfont>$pagenav $firstunread </smallfont></td>
<td align="right">
<p align="center"><smallfont>
<img src="gold/prev.gif" alt="" border="0">
<a href="showthread.php?s=$session[sessionhash]&threadid=$threadid&goto=nextoldest">الموضوع السابق</a>
 
<a href="showthread.php?s=$session[sessionhash]&threadid=$threadid&goto=nextnewest">الموضوع التالي</a>
<img src="gold/next.gif" alt="" border="0">
</smallfont></td>
</tr>
</table>
</center>
</div>


<div align="center">
<center>

<table cellpadding="0" cellspacing="0" border="0" bgcolor="" width="95%"><tr><td>
<table cellPadding="3" width="100%" border=1 borderColor=#092A42 borderColorDark=#FFFFFF borderColorLight=#092A42 cellspacing=3>
<tr>
<td bgcolor="#B37D33" background="gold/bg_cat.jpg" width="175" nowrap><smallfont color="#FEF5EB" class="thtcolor"><b>الكاتب</b></smallfont></td>
<td bgcolor="#B37D33" background="gold/bg_cat.jpg" width="100%">

<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100%"><smallfont color="#FEF5EB" class="thtcolor"><b>الموضوع</b></smallfont></td>
<td><a href="newthread.php?s=$session[sessionhash]&action=newthread&forumid=$forum[forumid]"><img src="gold/newthread.gif" border="0" alt="إضافة موضوع جديد"></a></td>
<td><normalfont>  </normalfont></td>
<td><a href="newreply.php?s=$session[sessionhash]&action=newreply&threadid=$threadid"><img src="$replyclose" border="0" alt="إضافة رد على الموضوع"></a></td>
</tr>
</table>

</td>
</tr>
</table>
</td></tr></table>

</center>
</div>


</td><td width="10"><img width="10" height="1" src="gold/space.gif" alt=""></td></tr></table>

ونقوم بتعديله إلى مايلي :

<table bgcolor="#FEF5EB" width="100%" cellpadding="0" cellspacing="0" border="0">
<tr><td width="100%">
$poll
<div align="center">
<center>
<table cellpadding="0" cellspacing="0" border="0" width="95%"><tr><td>
<table cellPadding="3" width="100%" border=0 borderColor=#092A42 borderColorDark=#FFFFFF borderColorLight=#092A42 cellspacing=3>
<tr>
<td width="175" nowrap><smallfont>$pagenav $firstunread </smallfont></td>
<td width="100%">

<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100%">
<p align="center"><smallfont>
<img src="gold/prev.gif" alt="" border="0">
<a href="showthread.php?s=$session[sessionhash]&threadid=$threadid&goto=nextoldest">الموضوع السابق</a>
 
<a href="showthread.php?s=$session[sessionhash]&threadid=$threadid&goto=nextnewest">الموضوع التالي</a>
<img src="gold/next.gif" alt="" border="0">
</smallfont></td>
<td><a href="newthread.php?s=$session[sessionhash]&action=newthread&forumid=$forum[forumid]"><img src="gold/newthread.gif" border="0" alt="إضافة موضوع جديد"></a></td>
<td><normalfont>  </normalfont></td>
<td><a href="newreply.php?s=$session[sessionhash]&action=newreply&threadid=$threadid"><img src="$replyclose" border="0" alt="إضافة رد على الموضوع"></a></td>
</tr>
</table>

</td>
</tr>
</table>
</td></tr></table>
</center>
</div>
</td></tr></table>

و الآن نأخذ الجزء التالي :

<table bgcolor="#FEF5EB" width="100%" cellpadding="0" cellspacing="0" border="0">
<tr><td width="10"><img width="10" height="1" src="gold/space.gif" alt=""></td><td width="100%">


<div align="center">
<center>

<table cellpadding="0" cellspacing="0" border="0" bgcolor="" width="95%"><tr><td>
<table cellPadding="3" width="100%" border=1 borderColor=#092A42 borderColorDark=#FFFFFF borderColorLight=#092A42 cellspacing=3>
<tr>
<td bgcolor="#B37D33" background="gold/bg_cat.jpg" width="100%">

<table border="0" cellspacing="0" cellpadding="0" bgcolor="#B37D33" background="gold/bg_cat.jpg">
<tr>
<td width="100%"><smallfont color="#FEF5EB"><b>$timezone</b></smallfont></td>
<td><a href="newthread.php?s=$session[sessionhash]&action=newthread&forumid=$forum[forumid]"><img src="gold/newthread.gif" border="0" alt="إضافة موضوع جديد"></a></td>
<td><normalfont>  </normalfont></td>
<td><a href="newreply.php?s=$session[sessionhash]&action=newreply&threadid=$threadid"><img src="$replyclose" border="0" alt="إضافة رد على الموضوع"></a></td>
</tr>
</table>

</td>
</tr>
</table>
</td></tr></table>

</center>
</div>


<div align="center">
<center>
<table cellpadding="2" cellspacing="0" border="0" width="95%">
<tr>
<td><smallfont>$pagenav </smallfont></td>
<td align="right">
<p align="center"><smallfont>
<img src="gold/prev.gif" alt="" border="0">
<a href="showthread.php?s=$session[sessionhash]&threadid=$threadid&goto=nextoldest">الموضوع السابق</a>
 
<a href="showthread.php?s=$session[sessionhash]&threadid=$threadid&goto=nextnewest">الموضوع التالي</a>
<img src="gold/next.gif" alt="" border="0">
</smallfont></td>
</tr>
</table>
</center>
</div>



</td><td width="10"><img width="10" height="1" src="gold/space.gif" alt=""></td></tr></table>

و نقوم بتعديله ليصبح على الشكل التالي :

<table bgcolor="#FEF5EB" width="100%" cellpadding="0" cellspacing="0" border="0">
<tr><td width="100%">
<div align="center">
<center>
<table cellpadding="0" cellspacing="0" border="0" width="95%"><tr><td>
<table cellPadding="3" width="100%" border=0 borderColor=#092A42 borderColorDark=#FFFFFF borderColorLight=#092A42 cellspacing=3>
<tr>
<td width="100%">

<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="100%"><smallfont><b>$timezone</b></smallfont></td>
<td><a href="newthread.php?s=$session[sessionhash]&action=newthread&forumid=$forum[forumid]"><img src="gold/newthread.gif" border="0" alt="إضافة موضوع جديد"></a></td>
<td><normalfont>  </normalfont></td>
<td><a href="newreply.php?s=$session[sessionhash]&action=newreply&threadid=$threadid"><img src="$replyclose" border="0" alt="إضافة رد على الموضوع"></a></td>
</tr>
</table>

</td>
</tr>
</table>
</td></tr></table>

</center>
</div>


<div align="center">
<center>
<table cellpadding="2" cellspacing="0" border="0" width="95%">
<tr>
<td><smallfont>$pagenav </smallfont></td>
<td align="right">
<p align="center"><smallfont>
<img src="gold/prev.gif" alt="" border="0">
<a href="showthread.php?s=$session[sessionhash]&threadid=$threadid&goto=nextoldest">الموضوع السابق</a>
 
<a href="showthread.php?s=$session[sessionhash]&threadid=$threadid&goto=nextnewest">الموضوع التالي</a>
<img src="gold/next.gif" alt="" border="0">
</smallfont></td>
</tr>
</table>
</center>
</div>

</td></tr></table>

ثم نحفظ التعديل

أخواني أرجو الملاحظة بمايلي : لا تعتقد أن هذه الرموز و الأكواد شيء معقد بل هو شيء بسيط جداً جداً فقط عليك التطبيق و بعض دقة الملاحظة لترى أن الأمر أكثر بساطة مما قد يظهر لك لأول وهلة ...

و بهذا نكون قد انتهينا من الخطوة الخامسة ..

و السلام عليكم

عماد الدين

التوقيع

الحمدُ للهِ الذي أنزلَ على عبدِهِ الكتابَ و لم يجعل لهُ عِوَجاً

أفضل أن تسأل 100 مرة من أن تخطئ مرة

آخر تعديل alkahf يوم 24 - 03 - 2004 في 05:12.

alkahf

إداري

الستايل المعتمد : Royal1


		#9	22 - 05 - 2003 ، 17:36

كتاب

السلام عليكم

هذا كتاب بسيط جدا و بالعربي للمبتدئين في لغة هتمل ، أرجو أن تجدوا فائدة منه ..
و السلام عليكم

عماد الدين

الملفات المرفقة

style-sheets.zip الحجم :(1 بايت ، مرات التحميل : 49 قراءة)

التوقيع

الحمدُ للهِ الذي أنزلَ على عبدِهِ الكتابَ و لم يجعل لهُ عِوَجاً

أفضل أن تسأل 100 مرة من أن تخطئ مرة

alkahf

إداري

الستايل المعتمد : Royal1


		#10	02 - 12 - 2003 ، 02:28

رد : كتاب

للرفع

التوقيع

الحمدُ للهِ الذي أنزلَ على عبدِهِ الكتابَ و لم يجعل لهُ عِوَجاً

أفضل أن تسأل 100 مرة من أن تخطئ مرة

alkahf

إداري

الستايل المعتمد : Royal1


		#11	02 - 12 - 2003 ، 15:57

رد : كتاب

جزاك الله خير الجزاء على هذا الشرح المفيد

وللإضافة .
لمن ليس لديهم ويندوز اكس بي يمكنهم تقطيع الصور عن طريق برنامج الفوتوشوب بأداة التقطيع الخاصة

ولكم التحية

التوقيع

لا تجرح التمثال في احسـاسه ,,, فلكم بكى في صمته تمثال

alFares

عضو عادي

الستايل المعتمد : (الافتراضي)


		#12	24 - 03 - 2004 ، 01:55

رد : كتاب

اقتباس:

	ثم نحفظ التعديل و نذهب الآن إلى صفحة المواضيع فنجدها كما يلي : http://test.vbulletinclub.com/showt...?s=&threadid=13 و تظهر الآن مشكلة ( أو ليست مشكلة بالمعنى الصحيح ) و لكنه مظهر غير مناسب ألا و هو هذا الشكل [img]images/showthread.gif[/img] و تعديل هذا الشكل يتم أيضاً من نفس التمبليت showthread

اخوي عماد مشكور على الشرح

وانا وصلت لحد الكلام اللي في الاقتباس

بس ما قدرت اكمل لاني ما لقيت الكود اللي بعد الاقتباس فشوه الحل؟

وانا ارفقت صور للنتائج اللي وتصلت اليها

وانا اشوف تاريخ الموضوع قديم واخاف انه لا يصلح لاني اجربه على النسخه الجديده

ارجو الافاده

تحياتي
عز العرب

عرض الصور المرفقة

اضغط الصورة لرؤيتها بالحجم الكبير
---------------------------
الاسم : test1.jpg
عدد مرات الظهور : 22
الحجم : 32 بايت

اضغط الصورة لرؤيتها بالحجم الكبير
---------------------------
الاسم : test.jpg
عدد مرات الظهور : 23
الحجم : 50 بايت

التوقيع

عز العرب

عضو عادي

الستايل المعتمد : (الافتراضي)


		#13	24 - 03 - 2004 ، 05:15

رد : كتاب

السلام عليكم
هذا الدرس للإصدار 2 و ليس للإصدار 3 ..
ولكن لو طبقت الآن الدرس على الأصدار 2 و تابعته خطوة خطوة حتى تنتهي منه و تفهمه جيداً ستجد عندها بنفسك الاختلاف البسيط بين الإصدار 2 و الإصدار 3 ...

و السلام عليكم

عماد

التوقيع

الحمدُ للهِ الذي أنزلَ على عبدِهِ الكتابَ و لم يجعل لهُ عِوَجاً

أفضل أن تسأل 100 مرة من أن تخطئ مرة

alkahf

إداري

الستايل المعتمد : Royal1