6:45 صباحًا الأحد 26 مايو، 2019

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

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

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

نستكمل معكم ما بدانا به
و ناتي لدرس تاطير الاقسام

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

الشرح فيديو

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

الحجم: 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
طبعا انا استخدمت هالقالب , لان الاقسام مفصوله عن بعضها
لذا تتطلب تعديل لهالقالبين
الحين نروح للمنتدى و نشوف
و الى هنا ينتهي الدرس

207 views

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