loulou ange
10-30-2013, بتوقيت غرينيتش 05:16 AM
http://r-khair.net/up/fwsl/slam.gif
اهلا ومرحبا بحضراتكم في
الدرس مفصل العاشر و الاخير :: دورة تصميم استايل style للمبتدئين
ولكنه في الحقيقه هو ليس درس مفصل لتصميم استايل style وانما هو درس مفصل تصميم الواجهه التابعه للاستايل style ..
والتي كنت لمحت لها في درس مفصلي السادس من الدورة
واسال الله ان ينفع بنا وبكم والله المستعان ؛
فلتتابعوا معي الدرس مفصل واي استفسارات انا بالخدمه ان شاء الله..
في الدرس مفصل السادس قد انتهينا من تصميم الهيكل الاساسي للواجهه
وهو يتمثل في هذه الصورة :
http://www.r-khair.net/up/style/normal/lesson6/007.png
وفي هذا الدرس مفصل سوف نصمم القوائم ونقوم بتركيب installها لتكتمل الواجهه
ونقوم برفعها بعد ذلك باذن الله
كما تعلمنا نقوم الان بفتح برنامج الفوتوشوب ..
ثم نفتح عمل جديد بهذه المقاسات ان شاء الله ..
http://www.r-khair.net/up/style/normal/lesson10/1.png
لتكن بالشكل التالي ان شاء الله :
http://www.r-khair.net/up/style/normal/lesson10/2.png
ثم نكب لون الخلفيه الاساسي بها كما تعلمنا
لتصبح بالشكل التالي ان شاء الله :
http://www.r-khair.net/up/style/normal/lesson10/3.png
ثم نستخدم اداة الرسم الدائري هذه :
http://www.r-khair.net/up/style/normal/lesson10/4.png
ثم نرسم مستطيل مع ترك مسافات بين الحواف الرئيسية للشكل الاساسي كالتالي :
http://www.r-khair.net/up/style/normal/lesson10/5.png
وفائده ذلك اننا سوف نقوم بوضع بعض التاثيرات ..
فهي تاخد حيز من الشكل الاساسي ..
وعند رسم الشكل ستجده اتوماتيكيا عمل لير جديد بقائمه الطبقات كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/6.png
سوف نقف على اللير ونضغط كليك يمين بالماوس
ثم نقوم بعمل rasterize كما تعلمنا
ثم نختار belnding opitions ونعطي له تاثير stroke كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/7.png
ليكن بالشكل التالي ان شاء الله تعالى ::
http://www.r-khair.net/up/style/normal/lesson10/8.png
ثم نقوم بعمل لير جديد ونستخدم اداه التحديد هذه ::
http://www.r-khair.net/up/style/normal/lesson10/9.png
ونحدد المنطقه العلويه كالتالي باذن الله :
http://www.r-khair.net/up/style/normal/lesson10/10.png
ثم نكب به اللون الاحمر او اللون المناسب لواجهتك الخاصه بك كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/11.png
ركزوا معي في هذه الخطوة لانها صعبه نوعا ما
الان سوف نقوم بعمل مطابقه للير الاخير هذا واللير المرسوم من قبل تابع معي ::
سنقف على لير الاخير هذا كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/12.png
ثم نضغط زرار ctrl من الكيبورد مع الضغط كليك شمال من الموس على اللير المرسوم هذا ::
http://www.r-khair.net/up/style/normal/lesson10/13.png
ليظهر لنا التحديد كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/14.png
ثم نضغط من الكيبورد على زراير ( ctrl+alt+shift+i )
ليظهر لنا التحديد بالشكل التالي ان شاء الله ::
http://www.r-khair.net/up/style/normal/lesson10/15.png
ثم نضغط على زرار delete لتتم المطابقه بعون الله كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/16.png
الان سوف نقوم بفتح العمل الاساسي للاستايل style والذي قمنا بتصميمه من قبل ..
وناخذ منه تاثيرات الهيدر header كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/17.png
ثم نضعها على هذا اللير الاخير كالتالي ان شاء الله ::
http://www.r-khair.net/up/style/normal/lesson10/18.png
لتكن بالشكل التالي ان شاء الله ::
http://www.r-khair.net/up/style/normal/lesson10/19.png
ويمكنك وضع تاثيرات جديده خاصه بك ان شاء الله وانت وذوقك ...
ثم نعمل كوبي لهذا اللير بعد وضع التاثيرات كالتالي ان شاء الله ::
http://www.r-khair.net/up/style/normal/lesson10/20.png
ثم نضغط على زرارين ( ctrl+t ) لعمل دوران لللير الاخير هذا
حتى نضعه باسفل القائمه ::
http://www.r-khair.net/up/style/normal/lesson10/21.png
نضغط كليك يمين بالماوس بداخل هذا الشبكه
ونختار flip virtcal كما شاهدنا
ثم نستخدم اداة التحريك هذه ::
http://www.r-khair.net/up/style/normal/lesson10/22.png
لنحرك هذا اللير الاخير الى اسفل القائمه لتكن كالشكل التالي باذن الله ::
http://www.r-khair.net/up/style/normal/lesson10/23.png
الان نحفظ العمل على هيئه صورة كما تعلمنا
ثم نقوم بفتحها لكي نقوم بتقطيعها ان شاء الله ..
ويستحسن حفظ العمل ايضا على هيئه psd
ربما تحدث اية اخطاء فيمكنك الرجوع اليه وان شاء الله يحصل خير ..
الان نفتح الصورة التي قمنا بحفظها
ونحاول تقليل الهوامش من حول القائمه قدر الامكان باداه التحديد الكالتالي :
http://www.r-khair.net/up/style/normal/lesson10/24.png
ثم ننسخها بزرارين ( ctrl + c ) ونفتح عمل جديد وكما علمنا انه عند النسخ
نجد ان العمل الجديد ياخذ نفس المقاسات المنسوخه من طول وعرض ..
فكل ماعلينا هو الضغط على زرارين ( ctrl + v )
وهذا لعمل لصق ان شاء الله ليكون الشكل كالتالي :
http://www.r-khair.net/up/style/normal/lesson10/25.png
ونبدا الان بالتقطيع ان شاء الله وهو اشبه مايكون من تقطيع الواجهه فتابعوا معي ...
باداه التحديد نحدد على المنطقه العلويه كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/26.png
ثم بزرارين (ctrl + c) ناخذها كوبي ونلصقها في عمل جديد ...
ثم نفعل ذلك مع المنطقه الوسطى والسفليه ليكن لدينا 3 قطع كالتالي ان شاء الله ...
http://www.r-khair.net/up/style/normal/lesson10/27.png
ونبدا بتقطيع قطعه قطعه ان شاء الله فتابعوا معي ...
ونبدا بالقطعه العلوية سوف نقوم بتقطيعها الى 3 قطع
(يمين - وسط - يسار) مع مراعاه المقاسات
فلنقطع مثلا اليمين كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/28.png
وبهذه المقاسات مثلا ::
http://www.r-khair.net/up/style/normal/lesson10/29.png
ثم ناخذها كوبي كما تعلمنا ونلصقها في عمل جديد
وناخذ القطعه اليسرى بنفس مقاسات اليمنى وناخذها نسخ ونلصقها بعمل جديد
ونقطع المنطقه الوسطة بنفس الارتفاع( h )
ولا يشترط العرض وناخذها كوبي ثم نلصقها في عمل جديد
لتكن المنطقه العلويه لدينا مقطعه الى 3 قطع كالتالي ان شاء الله ::
http://www.r-khair.net/up/style/normal/lesson10/30.png
وكذلك الحال بالنسبه للمنطقه السفليه والوسطى مع مراعاه ان يكون ::
عرض القطعتين اليمنى واليسرى بنفس عرض القطعتين اليمنى واليسرى في المنطقه العلويه اي ( w : 0.74 ) في هذا المثال ...
http://www.r-khair.net/up/style/normal/lesson10/31.png
ليكن كما شاهدنا لدينا 9 قطع من القائمه كامله ان شاء الرحمن ......
ثم نبدا بحفظ القطع على هيئه صور لدينا بالجهاز والافضل ان يكونوا بداخل فولدر
فانا مثلا سوف اضعهم بفولدر اسمه qima وبالاسماء التاليه ::
http://www.r-khair.net/up/style/normal/lesson10/32.png
والان انتهينا بفضل الله من الفوتوشوب سنتجه الى الفرونت بيج والله المستعان ...
وتعلمنا والحمد لله الاعدادت في الفرونت بيج في الدروس السابقه وسنقتصر على ذكر بعضها فقط ...
اولا نعمل جدول مكون من 9 خانات ونعطيه نفس القيم التاليه
من خصائص الجدول كما ذكرنا من قبل ::
http://www.r-khair.net/up/style/normal/lesson10/33.png
ليكن كالشكل التالي ان شاء الله تعالى :::
http://www.r-khair.net/up/style/normal/lesson10/34.png
ثم نسحبه الى الداخل من الجانب الايمن ليصبح شكله كالتالي باذن الله تعالى ::
http://www.r-khair.net/up/style/normal/lesson10/35.png
ثم نضيف الصور اليمنى واليسرى لكل الخلايا من زرار اضافه صورة
ولا ننسى التوسيط قبل اي اضافه ليكن الشكل كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/36.png
ثم نضيف الصور الوسطى للخلايا الوسطى من خصائص الخليه
ثم استعراض ولاننسى التوسيط ايضا قبل اي اضافه ليكن الشكل كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/37.png
وخطوة اضافيه هنا وهي اضافه صور المنطقه الوسطى (اليمنى واليسرى) مرة ثانيه
من خصائص الخليه وهذا لانها تتمدد ..
وبكده انتهينا من تركيب install القطع والحمد لله
ولنحفظ ملف الاندكس كما تعلمنا بجانب مجلد الصور ليكونا كالتالي باذن الله ::
http://www.r-khair.net/up/style/normal/lesson10/38.png
والغرض من هذا هو حفظ العمل حتى اذا حدث خطا فيما بعد
فلنرجع له وان شاء الله يحصل خير ..
الان نريد تركيب install القوائم هذه في الواجهه الخاصه بنا ورؤيتها على الطبيعه ان شاء الرحمن ...
وهنا نحتاج اجراء بعض الاعدادات قبل فعل ذلك ان شاء الرحمن ...
اولا نسحب العمود الايمن من القائمه الى اليمن والاعمده الوسطى
(اليمين الى اليمين و اليسار الى اليسار )
ليكن شكل القائمه كالتالي باذن الله تعالى ::
http://www.r-khair.net/up/style/normal/lesson10/39.png
ثانيا سوف نقوم باستبدال اليمين باليسار واليسار باليمين
من تعليمات برمجيه اسفل البرنامج ...
كل ماعليك فعله هو تغيير اسم القطع اليمين الى اليسار واليسار الى اليمين لتكن كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/40.png
ثم ننقل مجلد qima بداخل مجلد صور الواجهه وهو في هذه الدورة باسم rafek-n
ثم حفظ ولا نغلق الفرونت بيج ولا القائمه ونفتح الواجهه بالفرونت بيج الان ...
ثم نعمل جدول مكون من 9 خانات بمنتصف الواجهه ونعطيه نفس القيم السابقه ::
http://www.r-khair.net/up/style/normal/lesson10/33.png
ليكن كالشكل التالي ان شاء الله تعالى :::
http://www.r-khair.net/up/style/normal/lesson10/41.png
والان نسحب العمود اليمين الى اليمين والعمود اليسار الى اليسار كما تعلمنا ...
ثم نذهب الى القائمه لناخذها نسخ كامله كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/42.png
ثم نذهب الى الواجهه ونلصقها في الخلايا ال 9 كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/43.png
ثم نقوم بتظبيط القوائم كما تعلمنا عن طريق سحب الاعمده لتكن في النهايه الواجهه بالشكل التالي ان شاء الله ::
http://www.r-khair.net/up/style/normal/lesson10/44.png
ثم ندخل الى التعليمات البرمجيه للواجهه و نقوم باستبدال qima الى rafek-n/qima او كما تسميهما انت وحسب الامتداد الموجود لديك ...
http://www.r-khair.net/up/style/normal/lesson10/45.png
ثم نضيف مانريدة من روابط واقسام كما تعلمنا من قبل ...
ثم نحفظ الواجهه كما عليها ونرفع ملف index ومجلد الصور
الى مجلد www بموقعك وبجوار بعضهما البعض
ثم اذهب الى موقعك وشوف النتيجه
واقول لكم الف مبروك عليكم انتهاء الدورة كامله (ستايل style وواجهه )
والواجهة interface مرفقه لمن يريد الاطلاع عليها ان شاء الله
باسورد فك الضغط : www.r-khair.net (http://www.r-khair.net/)
http://r-khair.net/up/fwsl/rmdan.gif
.:ليس بالضروري ان مانقدمه من دورات هو الاصح وانما هو احد الطرق الصحيحه:.
http://r-khair.net/up/fwsl/slam.gif
الملفات المرفقة
http://www.traidnt.net/vb/images/attach/zip.gif face-rafek-n.zip (http://www.traidnt.net/vb/attachments/212956d1201658565-face-rafek-n.zip) (114.1 كيلوبايت, عدد مرات المشاهدة 70 مرة)
https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©
اهلا ومرحبا بحضراتكم في
الدرس مفصل العاشر و الاخير :: دورة تصميم استايل style للمبتدئين
ولكنه في الحقيقه هو ليس درس مفصل لتصميم استايل style وانما هو درس مفصل تصميم الواجهه التابعه للاستايل style ..
والتي كنت لمحت لها في درس مفصلي السادس من الدورة
واسال الله ان ينفع بنا وبكم والله المستعان ؛
فلتتابعوا معي الدرس مفصل واي استفسارات انا بالخدمه ان شاء الله..
في الدرس مفصل السادس قد انتهينا من تصميم الهيكل الاساسي للواجهه
وهو يتمثل في هذه الصورة :
http://www.r-khair.net/up/style/normal/lesson6/007.png
وفي هذا الدرس مفصل سوف نصمم القوائم ونقوم بتركيب installها لتكتمل الواجهه
ونقوم برفعها بعد ذلك باذن الله
كما تعلمنا نقوم الان بفتح برنامج الفوتوشوب ..
ثم نفتح عمل جديد بهذه المقاسات ان شاء الله ..
http://www.r-khair.net/up/style/normal/lesson10/1.png
لتكن بالشكل التالي ان شاء الله :
http://www.r-khair.net/up/style/normal/lesson10/2.png
ثم نكب لون الخلفيه الاساسي بها كما تعلمنا
لتصبح بالشكل التالي ان شاء الله :
http://www.r-khair.net/up/style/normal/lesson10/3.png
ثم نستخدم اداة الرسم الدائري هذه :
http://www.r-khair.net/up/style/normal/lesson10/4.png
ثم نرسم مستطيل مع ترك مسافات بين الحواف الرئيسية للشكل الاساسي كالتالي :
http://www.r-khair.net/up/style/normal/lesson10/5.png
وفائده ذلك اننا سوف نقوم بوضع بعض التاثيرات ..
فهي تاخد حيز من الشكل الاساسي ..
وعند رسم الشكل ستجده اتوماتيكيا عمل لير جديد بقائمه الطبقات كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/6.png
سوف نقف على اللير ونضغط كليك يمين بالماوس
ثم نقوم بعمل rasterize كما تعلمنا
ثم نختار belnding opitions ونعطي له تاثير stroke كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/7.png
ليكن بالشكل التالي ان شاء الله تعالى ::
http://www.r-khair.net/up/style/normal/lesson10/8.png
ثم نقوم بعمل لير جديد ونستخدم اداه التحديد هذه ::
http://www.r-khair.net/up/style/normal/lesson10/9.png
ونحدد المنطقه العلويه كالتالي باذن الله :
http://www.r-khair.net/up/style/normal/lesson10/10.png
ثم نكب به اللون الاحمر او اللون المناسب لواجهتك الخاصه بك كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/11.png
ركزوا معي في هذه الخطوة لانها صعبه نوعا ما
الان سوف نقوم بعمل مطابقه للير الاخير هذا واللير المرسوم من قبل تابع معي ::
سنقف على لير الاخير هذا كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/12.png
ثم نضغط زرار ctrl من الكيبورد مع الضغط كليك شمال من الموس على اللير المرسوم هذا ::
http://www.r-khair.net/up/style/normal/lesson10/13.png
ليظهر لنا التحديد كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/14.png
ثم نضغط من الكيبورد على زراير ( ctrl+alt+shift+i )
ليظهر لنا التحديد بالشكل التالي ان شاء الله ::
http://www.r-khair.net/up/style/normal/lesson10/15.png
ثم نضغط على زرار delete لتتم المطابقه بعون الله كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/16.png
الان سوف نقوم بفتح العمل الاساسي للاستايل style والذي قمنا بتصميمه من قبل ..
وناخذ منه تاثيرات الهيدر header كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/17.png
ثم نضعها على هذا اللير الاخير كالتالي ان شاء الله ::
http://www.r-khair.net/up/style/normal/lesson10/18.png
لتكن بالشكل التالي ان شاء الله ::
http://www.r-khair.net/up/style/normal/lesson10/19.png
ويمكنك وضع تاثيرات جديده خاصه بك ان شاء الله وانت وذوقك ...
ثم نعمل كوبي لهذا اللير بعد وضع التاثيرات كالتالي ان شاء الله ::
http://www.r-khair.net/up/style/normal/lesson10/20.png
ثم نضغط على زرارين ( ctrl+t ) لعمل دوران لللير الاخير هذا
حتى نضعه باسفل القائمه ::
http://www.r-khair.net/up/style/normal/lesson10/21.png
نضغط كليك يمين بالماوس بداخل هذا الشبكه
ونختار flip virtcal كما شاهدنا
ثم نستخدم اداة التحريك هذه ::
http://www.r-khair.net/up/style/normal/lesson10/22.png
لنحرك هذا اللير الاخير الى اسفل القائمه لتكن كالشكل التالي باذن الله ::
http://www.r-khair.net/up/style/normal/lesson10/23.png
الان نحفظ العمل على هيئه صورة كما تعلمنا
ثم نقوم بفتحها لكي نقوم بتقطيعها ان شاء الله ..
ويستحسن حفظ العمل ايضا على هيئه psd
ربما تحدث اية اخطاء فيمكنك الرجوع اليه وان شاء الله يحصل خير ..
الان نفتح الصورة التي قمنا بحفظها
ونحاول تقليل الهوامش من حول القائمه قدر الامكان باداه التحديد الكالتالي :
http://www.r-khair.net/up/style/normal/lesson10/24.png
ثم ننسخها بزرارين ( ctrl + c ) ونفتح عمل جديد وكما علمنا انه عند النسخ
نجد ان العمل الجديد ياخذ نفس المقاسات المنسوخه من طول وعرض ..
فكل ماعلينا هو الضغط على زرارين ( ctrl + v )
وهذا لعمل لصق ان شاء الله ليكون الشكل كالتالي :
http://www.r-khair.net/up/style/normal/lesson10/25.png
ونبدا الان بالتقطيع ان شاء الله وهو اشبه مايكون من تقطيع الواجهه فتابعوا معي ...
باداه التحديد نحدد على المنطقه العلويه كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/26.png
ثم بزرارين (ctrl + c) ناخذها كوبي ونلصقها في عمل جديد ...
ثم نفعل ذلك مع المنطقه الوسطى والسفليه ليكن لدينا 3 قطع كالتالي ان شاء الله ...
http://www.r-khair.net/up/style/normal/lesson10/27.png
ونبدا بتقطيع قطعه قطعه ان شاء الله فتابعوا معي ...
ونبدا بالقطعه العلوية سوف نقوم بتقطيعها الى 3 قطع
(يمين - وسط - يسار) مع مراعاه المقاسات
فلنقطع مثلا اليمين كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/28.png
وبهذه المقاسات مثلا ::
http://www.r-khair.net/up/style/normal/lesson10/29.png
ثم ناخذها كوبي كما تعلمنا ونلصقها في عمل جديد
وناخذ القطعه اليسرى بنفس مقاسات اليمنى وناخذها نسخ ونلصقها بعمل جديد
ونقطع المنطقه الوسطة بنفس الارتفاع( h )
ولا يشترط العرض وناخذها كوبي ثم نلصقها في عمل جديد
لتكن المنطقه العلويه لدينا مقطعه الى 3 قطع كالتالي ان شاء الله ::
http://www.r-khair.net/up/style/normal/lesson10/30.png
وكذلك الحال بالنسبه للمنطقه السفليه والوسطى مع مراعاه ان يكون ::
عرض القطعتين اليمنى واليسرى بنفس عرض القطعتين اليمنى واليسرى في المنطقه العلويه اي ( w : 0.74 ) في هذا المثال ...
http://www.r-khair.net/up/style/normal/lesson10/31.png
ليكن كما شاهدنا لدينا 9 قطع من القائمه كامله ان شاء الرحمن ......
ثم نبدا بحفظ القطع على هيئه صور لدينا بالجهاز والافضل ان يكونوا بداخل فولدر
فانا مثلا سوف اضعهم بفولدر اسمه qima وبالاسماء التاليه ::
http://www.r-khair.net/up/style/normal/lesson10/32.png
والان انتهينا بفضل الله من الفوتوشوب سنتجه الى الفرونت بيج والله المستعان ...
وتعلمنا والحمد لله الاعدادت في الفرونت بيج في الدروس السابقه وسنقتصر على ذكر بعضها فقط ...
اولا نعمل جدول مكون من 9 خانات ونعطيه نفس القيم التاليه
من خصائص الجدول كما ذكرنا من قبل ::
http://www.r-khair.net/up/style/normal/lesson10/33.png
ليكن كالشكل التالي ان شاء الله تعالى :::
http://www.r-khair.net/up/style/normal/lesson10/34.png
ثم نسحبه الى الداخل من الجانب الايمن ليصبح شكله كالتالي باذن الله تعالى ::
http://www.r-khair.net/up/style/normal/lesson10/35.png
ثم نضيف الصور اليمنى واليسرى لكل الخلايا من زرار اضافه صورة
ولا ننسى التوسيط قبل اي اضافه ليكن الشكل كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/36.png
ثم نضيف الصور الوسطى للخلايا الوسطى من خصائص الخليه
ثم استعراض ولاننسى التوسيط ايضا قبل اي اضافه ليكن الشكل كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/37.png
وخطوة اضافيه هنا وهي اضافه صور المنطقه الوسطى (اليمنى واليسرى) مرة ثانيه
من خصائص الخليه وهذا لانها تتمدد ..
وبكده انتهينا من تركيب install القطع والحمد لله
ولنحفظ ملف الاندكس كما تعلمنا بجانب مجلد الصور ليكونا كالتالي باذن الله ::
http://www.r-khair.net/up/style/normal/lesson10/38.png
والغرض من هذا هو حفظ العمل حتى اذا حدث خطا فيما بعد
فلنرجع له وان شاء الله يحصل خير ..
الان نريد تركيب install القوائم هذه في الواجهه الخاصه بنا ورؤيتها على الطبيعه ان شاء الرحمن ...
وهنا نحتاج اجراء بعض الاعدادات قبل فعل ذلك ان شاء الرحمن ...
اولا نسحب العمود الايمن من القائمه الى اليمن والاعمده الوسطى
(اليمين الى اليمين و اليسار الى اليسار )
ليكن شكل القائمه كالتالي باذن الله تعالى ::
http://www.r-khair.net/up/style/normal/lesson10/39.png
ثانيا سوف نقوم باستبدال اليمين باليسار واليسار باليمين
من تعليمات برمجيه اسفل البرنامج ...
كل ماعليك فعله هو تغيير اسم القطع اليمين الى اليسار واليسار الى اليمين لتكن كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/40.png
ثم ننقل مجلد qima بداخل مجلد صور الواجهه وهو في هذه الدورة باسم rafek-n
ثم حفظ ولا نغلق الفرونت بيج ولا القائمه ونفتح الواجهه بالفرونت بيج الان ...
ثم نعمل جدول مكون من 9 خانات بمنتصف الواجهه ونعطيه نفس القيم السابقه ::
http://www.r-khair.net/up/style/normal/lesson10/33.png
ليكن كالشكل التالي ان شاء الله تعالى :::
http://www.r-khair.net/up/style/normal/lesson10/41.png
والان نسحب العمود اليمين الى اليمين والعمود اليسار الى اليسار كما تعلمنا ...
ثم نذهب الى القائمه لناخذها نسخ كامله كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/42.png
ثم نذهب الى الواجهه ونلصقها في الخلايا ال 9 كالتالي ::
http://www.r-khair.net/up/style/normal/lesson10/43.png
ثم نقوم بتظبيط القوائم كما تعلمنا عن طريق سحب الاعمده لتكن في النهايه الواجهه بالشكل التالي ان شاء الله ::
http://www.r-khair.net/up/style/normal/lesson10/44.png
ثم ندخل الى التعليمات البرمجيه للواجهه و نقوم باستبدال qima الى rafek-n/qima او كما تسميهما انت وحسب الامتداد الموجود لديك ...
http://www.r-khair.net/up/style/normal/lesson10/45.png
ثم نضيف مانريدة من روابط واقسام كما تعلمنا من قبل ...
ثم نحفظ الواجهه كما عليها ونرفع ملف index ومجلد الصور
الى مجلد www بموقعك وبجوار بعضهما البعض
ثم اذهب الى موقعك وشوف النتيجه
واقول لكم الف مبروك عليكم انتهاء الدورة كامله (ستايل style وواجهه )
والواجهة interface مرفقه لمن يريد الاطلاع عليها ان شاء الله
باسورد فك الضغط : www.r-khair.net (http://www.r-khair.net/)
http://r-khair.net/up/fwsl/rmdan.gif
.:ليس بالضروري ان مانقدمه من دورات هو الاصح وانما هو احد الطرق الصحيحه:.
http://r-khair.net/up/fwsl/slam.gif
الملفات المرفقة
http://www.traidnt.net/vb/images/attach/zip.gif face-rafek-n.zip (http://www.traidnt.net/vb/attachments/212956d1201658565-face-rafek-n.zip) (114.1 كيلوبايت, عدد مرات المشاهدة 70 مرة)
https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©
