نبداء ان شاء الله بدروس تصميم الستايلات للمنتديات vb.0.xx
والبداية تكون من الصفر بأذن الله ليستفيد المبتدئ والمحترف
راح تكون الدروس عبارة عن حلقات واتمنى التطبيق لكل درس لتعم الفائده
اولا الدروس الخاصه بالمبتدئين وبعدها المحترفين واخيرا مستوى الدروس الفوق احترافيه والفنيه
نبداء على بركة الله :::::: واتمنى التوفيق للجميع ::::::::
افتح برنامج الفوتوشوب بالضغط مرتين على ايقونة البرنامج ( دبل كليك )
اختر من قائمة ملف .. جديد .. كما تلاحظ
أضبط الأعدادات كما تلاحظ بالصوره
من قائمة الادوات اختر المربع وارسم مربع علوي ( بنر ) ومربع سفلي ( فوتر )
نبداء بتعديل المربع العلوي لأعطائه شكل افضل وهذا بالضغط على اداة التعديل اسفل قائمة اللير كما بالصوره
نختار الخيار الأخير وهو خيار لاعطاء تحديد للبنر ونقوم بضبط الاعدادات كما تلاحظ بالصوره ... وارجوا الانتباه والتطبيق كما بالصوره .. واذا تعرفت على الخصائص تقدر تعدل على حسب تصميمك .. نتابع الصوره
ننتقل للخيار الثاني وهو اعطاء بروز للمربع .. نطبق الاعدادات كما بالصوره
ثم الخيار الثالث وهو لاعطاء ضل داخلي للمربع .. تابع الصوره وطبق الاعدادات كما تلاحظ
وننتقل للخيار الاخير وهو اعطاء ضل خارجي للمربع نطبق الاعدادات وبعد الانتهاء نضغط على زر ( new style ) او نمط جديد راح تظهر رساله اضغط على موافق وبعدها اضغط على موافق في الخيارات لحفظ اعدادات المربع العلوي وبكذا نكون انتهينا من المربع العلوي
وبالنسبه للمربع السفلي نطبق نفس الخيارات وللتسهيل نختار النمط المحفوظ لدينا من قائمة وندوز او نوافذ ونطبقها على المربع السفلي كما بالصوره
راح يضهر الشكل كما بالصوره التاليه
الحين اضف بعض اللمسات او اكتب اسم الموقع مع حفظ الحقوق بالاسفل كما بالصوره
وبكذا نكون خلصنا من الحلقة الاولى لتصميم الستايل للمبتدئين
وبقي علينا ... تقطيع الستايل .. توزيع الستايل ببرنامج الفرونت بيج .. تركيب الستايل للمنتدى ... وضبط الوان الستايل
وخلاص
اتمنى تطبيق الدروس لنتابع الى الاحتراف بأذن الله نبداء
نفتح برنامج فوتوشوب ونفتح الستايل الذي صممناه في الحلقه الاول من فتح واختيار الملف المفتوح من الجهاز
بعد فتح الملف .. نظهر تخطيط الشبكه للبرنامج لكي نضبط المقاسات بشكل سليم .. طريقة اضهارها .. تابع الصوره
نبداء بالتقطيع .. نختار أداة التقطيع من الأدوات وهي محدده باللون الاحمر بالصوره التاليه .... عند التقطيع نضغط بالزاويه الاولى المحدده بالنقطه الحمراء ونسحب الى النقطة الثانيه الحمراء
وهكذا نكون قطعنا اول زاويه .. ولاحظ عدد المربعات بالشبكه ... الزاويه العلويه يكون مقاسها ... عرض مربعين ..و ارتفاع 12 مربع .. والمقاس على حسب تصميمك تقدر تغيره ولاكن انتبه للأرتفاع بالبنر العلوي يكون الارتفاع واحد لجميع التقطيعات والبنر السفلي ايضا لازم يتساوى الارتفاع لجميع التقطيعات .. تابع الصور .. والزوايا باللون الاخضر
الأن نبداء بتقطيع منطقة التمدد ... وهذه المنطقه لازم تركز بها ... اولا لازم عند تمددها لاتشوه الستايل يعني خلها مستقيمه مابها تعرجات و اجعلها خاليه من الصور وهي منطقه صغير تقدر تتحكم بها من غير لاتشوه تصميمك تابع الصوره .. المنطقه باللون الاحمر .. وهنا مقاسها .. مربع واحد فقط عرض .. والارتفاع كما قلنا يتساوى مع ارتفاع البنر العلوي او السفلي على حسب مكانها
الحين نجي للمنطقه الرئيسيه وهي التي تحمل اغلب شكل البنر او الفوتر يعني المنطقه هذى تحمل الاسم للموقع وصور تجميليه وخلافه وهي منطقه كبيره تتحكم بها على كيفك
تابع الصوره .. والمنطقه باللون الازرق .. ومقاسها .. عرض 50 مربع .. وارتفاع نفس الارتفاع للبنر او الفوتر
خلصنا التقطيع ... وهذا الشكل النهائي بعد التقطيع
الأن نبداء بحفظ الستايل بعد تقطيعه .. وطريقة الحفظ كالتالي ::
نختار ملف او file *تابع الصوره
بعد اختيار الحفظ كصفحه انترنت .. تطلع صفحه اضغط على حفظ او save تابع الصوره
الأن تابع الصوره التاليه :: والشرح بعدها ::
رقم 1 :: اختر مكان حفظ المجلد للستايل .. اختر اي مكان بجهازك وليكن المستندات
رقم 2 :: اختر اسم لصور الستايل اختر اي اسم وليكم des-ksa ولاكن انتبه لاتضع الاسم عربي ولا تضع مسافات اكتبه اسم او اختصرها وضع حرف انجليزي واحد وخلاص
رقم 3 :: اختر الحفظ على شكل صور فقط كما هو واضح بالصوره
رقم 4 :: اضغط حفظ بعد الانتهاء ... واذهب للمكان ال1ي حفظت المجلد به وشاهد ستايلك مقطع وباقي عليه التركيب فقط ...
انتظروا درس التركيب قريب جدا ان شاء الله
للي يحب انه يطبق على الستايل هذا ... تجد بالمرفقات الستايل مقطع وجاهز
نكمل الحلقه الثالث من حلقات تصميم الستايل للمبتدئين
عنوان الحلقه .. توزيع الستايل العادي على الفرونت بيج
البرامج المستخدمه بالدرس . فرونت بيج 2003 عربي .. وهذا ماننصح به . لان الأصدار 2000 راح تنتج مشاكل انت
بغنى عنها
:: نبــــــــــداء ::
افتح برنامج الفرونت بيج
اول شي نجهز المساحه للستايل ... نروح لتعليمات برمجيه ونمسح جميع الأكواد داخلها ... كما بالصوره
والان نرجع الى المساحه بالضغط على زر تصميم بجنب التعليمات البرمجيه .. ونضغط باي مكان بالصفحه على الزر الايمن ونختار خصائص الصفحه كما بالصورهى
نحول الاتجاه الى يمين يسار ... كما تلاحظ
نذهب الى ادراج جدول وندرج 3 اعمده و 3 صفوف
نضغط بالزر الايمن باي مكان بالجدول ونختار خصائص الجدول ..
نضبط الاعدادات كما تلاحظ بالصوره
الان نبداء بأدراج الصور وطبعا ليست جميع الصور تدرج .... منطقة التمدد لابد ان تكون على شكل خلفيه ... تابع وراح يتضح كل شي ....
ندرج الان الزوايا ... نذهب الى مكان الزاويه اليمنى ونضغط مره واحد داخل المربع المخصص له ونضغط على زر ادراج صوره كما تلاحظ
نختار الزاويه من الجهاز ونضغط على ادراج
بعد ادراج جيمع الزوايا بنفس الطريقه . ينتج هذا الشكل
الان نريد ترتيب الزوايا ... وهذا يتم بشد الوسط الى اليمين واليسار ... لاحظ الصوره .. مكان الدائره اذا مررت مؤشر الفاره راح يتغير شكله اول مايتغير االمؤشر اضغط وسحب بأتجاه السهم .
بعد الشد . ينتج هذا الشكل .... كما بالصوره ... نريد الان ادراج القطعه الاساسيه للبنر .. كما فعلنا بالزوايا . نضغط بالمكان المخصص ونختار ادراج من الزر المخصص .. تابع
نختار الصوره التي نريد ادراجها
ينتج عندنا هذا الشكل .... طبعا ندرج للمربع السفلي تماما مثل العلوي نفس الطريقه ونختار الصوره المخصصه له ...
الان نعطيى البنرات اتجاه اليمين .. وهذه الخطوه لكي لاينتج اخطاء عند تمدد المنتدى . كما تلاحظ
الان بقي منطقة التمدد .... نذهب الى المكان الفارغ بجانب البنر ونضغط الزر الايمن بالفاره ونختار خصائص الخليه
طبعا كما قلنا للبنر والفوتر نفس الشي ...... الان نضغط على استعراض ونختار منطقة التمدد المراد ادراجها
ينتج هذا الشكل وهو الشكل النهائي ............. بقي علينا توسيط المنتدى .. كل ماعليك هو الضغط كما هو موضح .. بالصوره .. بالنص وتختار توسيط من فوق
انتهينا من توزيع الستايل وسيتم ادراج الدرس الرابع وهو تركيب الستايل على المنتدى .. وضبط المنتدى ليتناسب مع ستايلك هناك نقطه من الدرس الثالث نكملها الان .. وهو بعد توسيط الخانه التي بالنص ... نعمل تظليل للخلايا التي بالنص ونعمل لها دمج
كما تلاحظ بالصوره
نذهب الان الى التعليمات البرمجيه ........... ونلاحظ الصوره .,.. التاليه ليتم الشرح عليها ::
الجزء باللون الاحمر ....... على حسب مكان الصور التي ادرجتها بالتصميم راح تلقى مسارها موجود في هذا المكان .. وهذا المسار راح نحذفه بالكامل .. ليس الان و لاكن تابع الدرس وبعدها راح نحذفه
الجزء باللون الأزرق ......... اسم مجلد الصور وهذا المجلد راح يتم رفعه الى مجلد المنتدى الرئيسي .. ليس الان .. تابع
الجزء باللون الاخضر ........... اسم الصوره .... ليس لك علاقه به .
الان نظلل الذي شرحناه سابقا وكان محدد باللون الاحمر ... كما بالصوره نظلله . ولاتنسى الرمز / لابد ان تظلله ايضا كما بالصوره تماما
تابع الصوره وسيتم الشرح عليها
بعد تظليل المسار الذي نريد حذفه .. نضغط على الزر المحدد بالرقم 1 وهو زر البحث والأستبدال
بعدها نضغط على الزر الموضح بالرقم 2 وهو الاستبدال
الان اذا وجدت شي مكتوب داخل رقم 3 احذفه تماما
نضغط على استبدال الكل الموضح بالرقم 4 وذلك لحذف جميع المسارات الغير لازمه وهي مسارات الصور على جهازك وانت تريد تركيب الستايل على موقعك فلابد ان تحذفها ليتم سحب الصور من الستايل من موقعك مباشره
الان بعد حذف المسارات ......... نذهب الى تعليمات برمجيه ::: ونلاحظ الصوره :
المحدد باللون الاخضر .............. هو البنر ( المربع العلوي )
المحدد باللون الأزرق ............... هو الفوتر ( المربع السفلي )
نذهب الان الى لوحة تحكم المنتدى .... كما بالصوره ....... رقم 1 وهو على حسب موقعك .. وبعدها ندخل الاسم والرقم للمشرف العام كما بالرقم 2
نذهب الى الأستايلات ثم ضبط الستايلات ....... كما بالصوره
نختار الستايل المراد التعديل عليه .. وليكن الرئيسي . ثم نضغط على أذهب :
الان نشاهد الصور ونضيف البنر المحدد سابقا والفوتر كلا في مكانه كما هو موضح بالصوره .
الان ننزل الى اخر شي بهذه الصفحه تجد كلمة حفظ كما هو محدد بالصوره .. اضغط عليها ونذهب لتشاهد الستايل راكب بشكل سليم ان شاء الله
... ويبقى تعديل الالوان سيتم ادراجه قريب جدا الدرس الاخير من سلسلة تصميم الستايل للمبتدئين
عنوان الدرس تلوين الستايل ليتناسب مع التصميم
قبل كل شي ... ناخذ لونين متناسقين مع الستايل .. خفيف وثقيل .. يعني فاتح وغامق
طريقة اخذ اكواد الألوان .. نفتح الفوتوشوب . تابع الصوره
للون الخفيف
للون الثقيل
الحين نفتح لوحة تحكم المنتدى .. تابع الصور
نختار ضبط الستايلات
نختار الستايل
ننزل لاول كود لألوان المنتدى كما بالصوره نغير الالوان الخلفيه خفيف والخط ثقيل
والمربع الى على اليسار نغير الأرقام من 10 و 10 و 5 الى 0 و 0 و 0
كما بالصوره
الحين نفس الطريقه نتابع لبقية الاكواد ... وهذى البعض منها
هذه الصور الاساسيه نعتبرها .. والباقي تقدر تحط مكان الخلفيه لون خفيف والخط ثقيل
طبعا تقدر تغير على كيفك بالالوان كل ماتضيف كود اذهب وحفظ ورح للمنتدى وجرب شف يركب او لا .. هنا نعطيك البدايه والباقي عليك
وبعد مانعدلها كلها ننزل للأخير ونختار حفظ ونشوف ستايلنا بعد التلوين
انتهت حلقات الستايل للمبتدئين