ط¯ظˆط±ط© ظ…ط·ظˆط± ظ„طھطµظ…ظٹظ… ط§ظ„ط§ط³طھط§ظٹظ„ط§طھ(ط¯ط±ط³ طھط£ط·ظٹط± ط§ظ„ط§ظ‚ط³ط§ظ… ط§ظ„ط±ط¦ظٹط³ظٹط©)



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

بسم الله الرحمن الرحيم

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

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

الشرح طريقة فيديو

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

الحجم: 12 ميجا


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


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

1- نروح نفتح الفرونت بيج
2-نضغط على code ثم نحذف كل مابه




3-بما ان الاقسام فى مطور مفصولة , راح نستخدم قالب templateين جاهزين للعمل عليهم

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

1- forumhome
2- forumhome_forumbit_level1-nopost

4- افتح بالمفكرة القالب template الثانى forumhome_forumbit_level1-nopost
ثم انسخ كل الكود code , وقم بلصقه فى الفرونت بيح بدل الكود code اللى حذفناه




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





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




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




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

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

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

شوف الصورة




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

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

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

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

افتح ملف psd اللى كنا حفظناه وشوف كل رقم قطعه , واستورد الرقم الخاص بالصورة فى الجدول المناسب لها ( لا تنسى بالعكس )


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



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

9- اولا/
شوف الصور 4و2
والصور 9 و11

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

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

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

الحين وانت على نفس الصورة(4) , اضغط كليك يمين ثم اختار cell properties

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



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

######

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

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

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

شوف راح نضغط دبل كليك على الصوره
ثم نضغط على general فوق وننسخ رابط الصورة فوق






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



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

كليك يمين ثم اختار cell properties

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







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

########



10- ثم نقوم بعمل الاتى لنختم عملنا
وهو ازالة حدود الجداول


على اى جدول علوى


كليك يمين -- ثم table properties

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






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


نختار اى واحد


كليك يمين ثم اختار table properties


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



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

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

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





والحين

للوحة تحكم المنتدى forum ثم الاستايل styleات والقوالب ثم البحث قفى القوالب

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










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

forumhome_forumbit_level1_nopost








بالمثل نروح نبحث فى القوالب عن قالب template forumhome ثم نمسح الكود code الموجود ونستبدله بالقالب template المرفق اللى اسمه forumhome

طبعا انا استخدمت هالقالب template , لان الاقسام مفصولة عن بعضها

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


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






والى هنا ينتهى الدرس مفصل


ولا ليش انت داخل الدروة :





الملفات المرفقة [TR]
FORUMHOME-2.txt (7.2 كيلوبايت, عدد مرات المشاهدة 360 مرة) [/TR]
[TR]
forumhome_forumbit_level1_nopost-2.txt (1.4 كيلوبايت, عدد مرات المشاهدة 388 مرة) [/TR]



©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©