![]() | ![]() |
| الرئيسية | مركز المعلومات | مركز التحميل | للاعلان في مُطِّورْ | استخدم ختم مطور | قوِ موضوعك هام | وسام مطور جديد | افحص البيج رانك جديد |
| |
| |||||||
| دورة تصميم ستايلات منتديات الفي بي vBulletin الدورة إنتهت
تضمن لك هذه الدورة أن تتعلم بأسلوب عملي وممتع وسهل الطرق الصحيحة للتمكن من تصميم استايلات منتديات الـ vBulletin بإتقان ملقي الدورة: [vista-design] |
![]() |
| | أدوات الموضوع | انواع عرض الموضوع |
|
#1
| ||||
| ||||
| الدرس الثالث: درس توزيع الصور على الفرونت بيج ![]() نستكمل معكم مشوار الدورة فى الجزء الاول كنا انتهينا من تقطيع الهيدر والفوتر, ونتج لنا ملف images بالصور الحين راح نأتى للخطوة القادمة , وهى توزيع هذه الصور على الفرونت بيج, حتى ننتج كود الهيدر والفوتر اللى راح نضعه فى الاستايل اللى راح ننتجه فى النهاية اولا: افتح برنامج الفرونت بيج2003 ,واول ما يفتح راح نقوم بحذف اى اكواد موجوده شوف........... ثم من أسفل اضغط على كلمة design وانت على الصفحة اضغط كليك يمين , ثم خصائص الصفحة page properties ثم راح نقوم بتغيير اتجاه الصفحة من اليمين لليسار , وحذف كل الحواف وجعلها صفر شوف....... شوف......... الحين لو تتذكر لما قمنا بالتقطيع, قمنا بتطقطيع الهيدر الى ثلاثة اجزء , والفوتر كذلك لثلاثة أجزاء 1-جزء ايسر 2-جزء أوسط 3-جزء أيمن لذلك راح نقوم بأضافة ثلاثة جداول علوية , بحيث كل جدول يشمل كل جزء من صور الهيدر وأيضا راح نقوم بأضافة ثلاثة جداول سفلية , بحيث كل جدول يشمل كل جزء من صور الفوتر وبين الثلاثة جداول العلوية , والسفلية , راح نقوم بأضافة جدول ويمثل محتوى المنتدى شوف كيف راح نسوى ذلك......... اولا : نضيف الجداول العلوية للهيدر شوف...... ثانيا: نضيف تحته مباشرة جدول واحد لمحتوى المنتدى شوف.......... ثالثا: نضيف الجداول السفلية للفوتر شوف....... والشكل النهائى راح يكون هكذا شوف....... الحين بدنا نرجع لمجلد images الذى نتج لما انتهينا من حفظ العمل فى الفوتوشوب ولما نفتحه راح نجد الصور الاتية: شوف............ الحين راح نقوم باضافة كل صورة للجدول الخاص بها شوف...... الجزء الايسر: نضغط على الجدول الايسر العلوى, ثم نضغط على ايقونة اضافة صورة ونضيف صورة الجزء الايسر للهيدر شوف........ بالمثل الجدول الاوسط , ونضيف له صورة الجزء الاوسط (نقطة التمدد) وراح يكون هيك الشكل النهائى: الحين راح نترك الجدول الاوسط فاضى , الواقع بين الثلاثة جداول العلوية والسفلية وننزل للثلاثة جداول السفلية الخاصة بالفوتر, ونطبق بالظبط مثل ما سوينا بالهيدر شوف الشكل النهائى........ الحين راح نقوم بظبط كل شىء حتى يتوافق ويركب على المنتدى.... اولا: نروح نزيل سمك الجداول شوف... نضغط على اى جدول علوى كليك يمين , ونختار table properties ثم نظبط على الاعدادات الاتية: شوف...... راح نجعل الاعدادات صفر مثل ما هو مشار بالسهم ونطبق بالظبط هالكلام , على الجدول الاوسط الواقع بين الهيدر والفوتر وايضا على جداول الفوتر شوف الشكل النهائى الحين بعد ما سوينا هيك راح نقوم بتوزيع الصور لتصبح على شكل خلايا اولا: بالنسبة لصورة الجدول الايسر العلوى دبل كليك على الصورة -- راح يطلع لك مقاسات الصورة احفظها فى بالك شوف....... ثم كليك يمين على الصورة اليسرى , ونختار cell properties وبعدين راح نضيف هالمقاسات مثل اللى بالصورة: شوف...... بعدين نطبق الكلام بالظبط على الصورة الاتية صورة الجزء الايمن --هيدر صورة الجزء الايسر--فوتر صورة الجزء الايمن -- فوتر ( لاحظ اننا تركنا صورة الجزء الاوسط للهيدر والفوتر) الحين , بعد ماطبقنا الكلام السابق على الصور اللى قلنا عليها, وطبعا لا تنسى انه كل صورة ليه مقاس مختلف , راح نحفظه ونحطه فى cell -properties المهم, راح نرجع الحين لصورة الجزء الاوسط للهيدر والفوتر شوف بالنسبة صورة الجزء الاوسط للهيدر راح نضغط على صورة الجزء الاوسط دبل كليك...... شوف...... بعدين راح ننسخ مسار الصورة شوف........ ثم كليك يمين على الصورة, ونختار cell-properties وراح نلصق مسار الصورة فى المكان الاتى: شوف....... الحين نقوم بعمل ما قمنا به بالظبط على صورة الجزء الاوسط للفوتر ويكون الشكل النهائى كالاتى: شوف........ الحين انتهينا والحمدلله من التوزيع راح نقوم بأخذ كود الهيدر والفوتر لكن قبل هذا قم بالظغط على الجدول الاوسط بين الهيدر والفوتر ثم نضغط على التوسيط شوف ........ الحين نضغط فى اسفل البرنامج على كلمة code وشوف كيف راح نأخذ كود الهيدر وكود الفوتر شوف.......... الحين تمام خلصنا من كل شىء الحين نروح لمنتدانا وندخل للوحة التحكم ومن الاستايلات والقوالب -- ثم التحكم بالاستايلات ثم اذهب بالنسبة للهيدر راح نقوم بحذف كل الكود الموجود فوق كلمة $spacer_open $_phpinclude_output ونترك هذول (مهم جدا) شوف ...... بالنسبة للفوتر راح نترك الكود الموجود كله وراح نضع الكود اللى حفظناه بالمفكرة مباشرة بعد الكود الموجود شوف.... بعدين انزل لتحت واحفظ...... الحين روح شوف المنتدى مبروك على تركيب الهيدر والفوتر ملحوظه: صور الهيدر والفوتر لن تظهر وانت على متصفح فايرفوكس لاننا لسه ما جينا لتعديل الروابط لذلك بفضل تشغل الانترنت الاكسبلورر حتى تشوف ناتج العمل ملاحـــــــــــــــــــــظـــــــــــــه للذين يعانون من اللغة مع انى مو شايف فيها مشكلة ![]() table properties=خصائص الجدول cell properties =خصائص الخلية page setup=اعدادات الصفحة width=العرض lenght=الطول centre=المنتصف ![]() هذا يمكن اللى راح نستخدمه فى شغلنا غير هيك ما فى بالتوفيق انتظروا الدرس الثالث اعدادات الcss اخوكم vista-design
آخر تعديل بواسطة vista-design ، 01-08-2008 الساعة 06:21 PM |
| |
![]() |
| العلامات المرجعية |
| |
مواضيع جديدة في قسم دورة تصميم ستايلات منتديات الفي بي vBulletin |
| |
| أدوات الموضوع | |
| انواع عرض الموضوع | |
|
|
المواضيع المتشابهه | ||||
| الموضوع | كاتب الموضوع | المنتدى | مشاركات | آخر مشاركة |
| طلب مساعده \ ممكن شرح توزيع الستايل المتوسط على الفرونت بيج | سلييط اللسان | صيانة و دعم فني منتديات و حل مشاكل المواقع | 2 | 15-12-2009 03:21 AM |
| مناقشة درس توزيع الصور على الفرونت بيج هنا | vista-design | دورة تصميم ستايلات منتديات الفي بي vBulletin | 125 | 28-08-2008 07:53 AM |
| سجل الزوار...الدرس الثالث | aymax.net 2 | دورة برمجة الـ PHP (المستوى الأول) | 0 | 23-08-2008 07:01 PM |
| مناقشة الدرس الثالث | المحترف | دورة ادارة السيرفرات (المستوى الأول) | 156 | 19-08-2008 01:57 AM |