درس تاطير الاقسام

الدرس الخامس:شرح تاطير الاقسام الرئيسية

نستكمل معكم ما بدانا به


و ناتي لدرس تاطير الاقسام

اولا: شرح طريقة عمل التاطير على الفوتوشوب + تقطيعة +تصديره

الشرح فيديو

حمل الفيديو من هنا

الحجم: 12 ميجا

ملاحظة هامه: بعد الانتهاء من العمل الي فالفيديو,
لا تنسي و تحفظ العمل الذي قمت فيه على هيئه ملف psd لاننا راح نستخدمة لاحقا فهذا الدرس

ثانيا: توزيع صور التاطير على الفرونت بيج حول الاقسام

1- نروح نفتح الفرونت بيج


2-نضغط على code بعدها نحذف جميع ما به


3-بما ان الاقسام فمطور مفصوله ,

راح نستخدم قالبين جاهزين للعمل عليهم

قم بتحميل القالبين من المرفقات و اسماء القوالب هى

1- forumhome


2- forumhome_forumbit_level1-nopost

4- افتح بالمفكرة القالب الثاني forumhome_forumbit_level1-nopost


بعدها انسخ جميع الكود ,

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


5- الحين اضغط بالماوس بالمنطقة المشار اليها كما بالصورة,
ثم


قم باضافه ثلاثه جداول علوية


6- بالمثل نقوم باضافه ثلاثه جدول سفليه اصفل القالب مباشرة


7- الحين راح يصبح الشكل هيك:


8- الحين راح نقوم بتوزيع الصور الخاصة بالتاطير الي قم بعملها فشرح الفيديو فوق……

ولكن لاحظ (مهم) اننا راح نقوم بعكس التوزيع للصور

يعني الي فاليسار راح نضفية للجدول اليمين و العكس

شوف الصورة


شوفت ,
التوزيع بالعكس ,



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

وتسوي كما شرحنا فتصميم الهيدر ( لكن بالعكس)


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

افتح ملف psd الي كنا حفظناة و شوف جميع رقم قطعة ,

واستورد الرقم الخاص بالصورة فالجدول المناسب لها ( لا تنسي بالعكس :p)


الحين بعد ما اضفنا الصور راح يصبح الشكل هيك


الحين ناتي للظبط

9- اولا/


شوف الصور 4و2


و الصور 9 و 11

راح نجعلهم خلية

راح اعطي مثال على صورة واحده و تطبق الباقي على الصور الباقية

الحين دبل كليك على الصورة رقم 4 بعدها نحفظ ارقام المقاسات

الحين و انت على نفس الصورة(4) ,

اضغط كليك يمين بعدها اختار cell properties

ثم راح نلصق المقاسات كما فالصورة التاليه:


طبق الكلام السابق على الصور 2 و 9 و 11


و الحين ناتي للصور 3و10 الي فالوسط

وهذه راح نجلعها خلفية

بالتاكيد هالمقال شرحتة من قبل فدرسنا السابق(تصميم الهيدر و الفوتر)


يعني الفكرة واحده

شوف راح نضغط دبل كليك على الصوره


بعدها نضغط على general فوق و ننسخ رابط الصورة فوق

ثم قم بحذف الصورة هذه


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

كليك يمين بعدها اختار cell properties

ثم نلصق مسار الصورة

ونطبق السابق بالمثل على الصورة الوسطي السفلي رقم 10


10- بعدها نقوم بعمل التالي لنختم عملنا


و هو ازاله حدود الجداولعلي اي جدول علوى


كليك يمين — بعدها table properties


شوف راح نصفر و نوسط القيم

بالمثل نسوي هذا على الجداول السفلية


نختار اي واحد


كليك يمين بعدها اختار table properties


و نصفر و نوسط القيم كالسابق


الحين نروح نضغط على كلمه كود code باسفل الفرونت بيج


و نقوم بنسخ الكود كله ….

ونحفظة فمفكرة

والحين

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

ثم نقوم بالبحث عن قالب forumhome_forumbit


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

forumhome_forumbit_level1_nopost


بالمثل نروح نبحث فالقوالب عن قالب forumhome بعدها نمسح الكود الموجود و نستبدلة بالقالب المرفق الي اسمه forumhome


بالتاكيد انا استعملت هالقالب ,

لان الاقسام مفصوله عن بعضها


لذلك تتطلب تعديل لهالقالبين


الحين نروح للمنتدي و نشوف


و الى هنا ينتهي الدرس