الموضوع: الدرس 4 الحدود الجانبية

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

قم بعمل شفيفة جديدة (new layer) كما في الصورة

باستعمال أداة التحديد قم بتحديد الجهة اليمنى و لونها باللون التالي
b92e3e#
و قم بنسخ الشفيفة بالضغط على Ctrl+j و انقلها إلى الجهة اليسرى.
ستحصل إن شاء الله على الشكل التالي :
[attachment=0:3r581yxu]shape.rar[/attachment:3r581yxu]

[bigimg:3r581yxu]http://www.science.43i.net/add/tour/page_body3.gif[/bigimg:3r581yxu]
لآن علينا إختيار الشكل الذي يكون على جانبي المنتدى أنا إخترت الشكل
التالي:
يمكنك إختيار الشكل الذي تريد.
قم بإنشاء شفيفة جديدة .
إنسخ الشكل و ألصقه في الجهة اليمنى .
بعدها إضغط على Ctrl+j لنسخ الشكل في شفيفة جديدة.
قم بعمل Edit->transform->Rotate 180° لقلب
الشكل ليناسب الجهة اليسرى . و قم بنقله للجهة اليسرى باستعمال Move Tool.
ستكون النتيجة هكذا :
[bigimg:3r581yxu]http://www.science.43i.net/add/tour/page_body4.gif[/bigimg:3r581yxu]
لآن سنضفي بعض اللمسات على الأشكال التي وضعنا :
قم باختيار الشفيفة التي وضعنا في الشكل الأول
طبق عليها الخطوات التالية :

طبق كما هو مبين في الصورة :

كذلك:

نفس الخطوات بالنسبة للشكل الخاص بالجهة اليسرى.
ليكون هذا هو الشكل النهائي :
[bigimg:3r581yxu]http://www.science.43i.net/add/tour/page_body8.gif[/bigimg:3r581yxu]
الآن قم بحفظ الصورة بالضغط على File->save for
web
و اختر نوع الصورة GIF أو إذا أردت JPEG لك الإختيار.

ثم عوض الصورة bg_body.gif الموجودة في المسار
styles/prosilver/theme/images/bg_body.gif

سيصبح شكل المنتدى هكذا :
[bigimg:3r581yxu]http://www.science.43i.net/add/tour/page_body11.gif[/bigimg:3r581yxu]
بقي تصميم الجهة العلوية و السفلية و الأشكال الطرفية لنا عودة في الردود
التالية

أعتدر إليكم إخوتي على التأخر بسبب ترتيبات المنتدى
المهم أين كنا في الدرس السابق ؟ ....
آه نعم صحيح بقي علنا تصميم الحدود السفلية و العلوية .
لنبدأ إذا على بركة الله .
قم بفتح مشروع جديد بالمواصفات التالية:

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

املأ الخلفية باللون التالي : #b92e3e و ذلك باستعمال الأداة لتكون الخلفية هكذا:

بعدها اختر الشكل الذي تريد وضعه في النصف العلوي هكذا :

بعدها قم بنسخ الشفيفة و ذلك يالضغط على CRT+j
و قم بنقلها إلى القسم السفلي بعد ذلك إضغط على edit ثم transforme و اختر flip horizontal لقلب الشكل ليناسب الستايل
ستكون النتيجة هكذا :

تذكر أن الخط الأحمر ليس إلا خطا وهميا .
احفظ الملف بامتداد .gif و انقله إلى مجلد الصور في الستايل .
طبق نفس الخطوات مع تسمية المشروع corners_bottom
وصمم هدا الشكل :

قم بتحميل الملف الموجود في المرفقات عوضه بالملف الموجود لديك في مجلد theme طبعا بعد فك الضغط

سيكون الستايل إن شاء الله هكذا :
[bigimg:4qgnusr0]http://www.science-collector.com/add/tour/less4/7.gif[/bigimg:4qgnusr0]
مازالت المناطق المشار لها بأسهم هلينا أن نصمم لها أشكال تشبه الأشكال الجانبية اليمنى و اليسرى.
افتح برنامج الفوتوشوب.
أنشأمشروع جديد 136*40 و سمه bg_headers
قم بملأ الخلفية بالون التالي:b92e3e#
وقم بوضع السكل السايق أفقيا لتتحصل على الشكل

قم يإنشاء مشروع جديد بنفس المقاسات و لكن هذه المرة تحت اسم bg_footers
طبق نفس الخطوات لكن هذه المرة اقلب الشكل كما في الصورة التالية

و ذلك عن طريق الضخط على ctr+t
في النهاية هذا هو الشكل النهائي
[bigimg:4qgnusr0]http://www.science-collector.com/add/tour/less4/10.gif[/bigimg:4qgnusr0]

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

شكراااااا