كيف تصمم استايل للمنتدى

[بوراشد]

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

الخطوه الاولى بتكون تصميم الإطار على الفوتوشوب طبعا كل واحد وأبداعه الشخصي وعلى سبيل المثال هذا الإطار اللي راح نشتغل عليه بعد مانكون إنتهينا من التصميم

ملاحظه حجم الاطار 800 على 600 بكسل والباك راوند شفاف قبل لا نبداء تصميم الاطار يكون احسن

http://alamuae.org/upload/alam/stail1.gif


الخطوه الثانيه تقطيع الإطار إلى أربع زوايا وأربع أوساط
راح نبداء بالزوايا القص بيكون (( ctrl x )) اضغط كنترول اكس عبلا الكيبورد بعد التحديد قص واللصق (( ctrl v )) كنترول في لصق

http://alamuae.org/upload/alam/stail2.gif
طبعا مافي داعي اقطع اربع زوايا بكتفي بزوايه وحده واقدر اعكس الاتجاه واتحكم فيها مثل ماهو موضح

http://alamuae.org/upload/alam/stailupl.gif

الصوره هاي لزوايه اليسار راح نعكسها لزاويه اليمين طبعا بعد مانخزنها يسار راح نبداء نعكس

http://alamuae.org/upload/alam/stail3.gif

[بوراشد]

راح تنعكس معانا الصور وتصبح الزاويه اليمين
http://alamuae.org/upload/alam/upr.gif
نخزن اليمين (( بيكون معانا يمين ويسار الزوايا اللي فوق ))
الخطوه التليه الزوايا الارضيه

http://alamuae.org/upload/alam/stail4.gif
الحين معانا الزاويه اليمين ارضيه باقي اليسار تابع الشرح

http://alamuae.org/upload/alam/stail5.gif

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

علشان تطلع الزوايا نفس حجم الأوساط نتبع الخطوه التاليه

http://alamuae.org/upload/alam/stail6.gif

[بوراشد]

لاحظ في الصوره رقم واحد حددت مكان القص نفس الزوايا في الصوره رقم اثنين احرك التحديد بأزرار الكيبور جهة اليمين وراح اقص الوسط بحيث يطلع نفس حجم الزاويه ومايكون اختلاف
وبنكرر نفس العمليه وراح نعكس الصور حتى تكتمل الثمان صور الشكل المربع ...
اربع زوايا للمربع

http://alamuae.org/upload/alam/upr.gif
http://http://alamuae.org/upload/alam/upl.gif
http://alamuae.org/upload/alam/donr.gif
http://alamuae.org/upload/alam/donl.gif
اربع اوساط للمربع

[بوراشد]

اربع اوساط للمربع

http://alamuae.org/upload/alam/up.gif
http://alamuae.org/upload/alam/don.gif
http://alamuae.org/upload/alam/rait.gif
http://alamuae.org/upload/alam/left.gif

[بوراشد]

الخطوه التاليه تجميع الاطار على الفرونت بيج ووضع كود التمبلت اتبع الخطوات التاليه نفتح (( 9 )) جداول

http://alamuae.org/upload/alam/stail7.gif
الخطوه التاليه رايت كلك على الجدول ونختار الخصايص مثل ماهو موضوح بالصوره
http://alamuae.org/upload/alam/stail8.gif

اتبع الخطوات التاليه في الصوره واحد توسيط
النسبه صفر لتحديد الجدول
شيل الصح من عند اظهار حدود الخلايا
تطبيق موافق


http://alamuae.org/upload/alam/stail9.gif

راح يكون معانا 9 جداول شفافه والحين نجمع الصور

(( ملاحظه هامه ))
الزوايها عن طريق ادراج صوره من ملف
::::::::
الاوساط ادراج خليه

السبب الاوساط تتمدد مع المنتدى لو ادرجناها صوره من ملف راح تطلع بحجمها الطبيعي بالمنتدى ..

1- ادراج صوره من ملف لزواااااااااااايا واول صوره مثال اعلى اليمين

http://alamuae.org/upload/alam/stail10.gif

[بوراشد]

وبطلع معانا الشكل هذا

http://alamuae.org/upload/alam/stail11.gif

وراح نكمل مع باقي الزوايا نفس الخطوات ادراج صوره من ملف

http://alamuae.org/upload/alam/stail12.gif

::::::::::::::::::

الخطوه التاليه الاوساط عباره عن خلايا لاحظ الخطوات اول خليه الوسط اليمين مثل ماهو موضح بالصوره
http://alamuae.org/upload/alam/stail13.gif


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

http://alamuae.org/upload/alam/stail14.gif

[بوراشد]

وبيكون معانا الشكل التالي وراح نلاحظ تكرر الوسط اليمين طنششششش وكمل باجي الاوساط

http://alamuae.org/upload/alam/stail15.gif
بعد مانكمل باجي الاوساط راح يطلع لنا الشكل التالي

http://alamuae.org/upload/alam/stail16.gif
الخطوه التاليه شد الزوايا بالمواس لين يصبح الشكل متناسق لاحظ الصوره التاليه طبعا هذا في الوضع العادي
http://alamuae.org/upload/alam/stail17.gif

اما في وضع المعاينه برفيووو راح يتغير الشكل لاحظ

http://alamuae.org/upload/alam/stail18.gif
:::::::::::::::::::::

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

http://alamuae.org/upload/alam/stail19.gif

نختار بعدها من الاسفل وضع كود html

http://alamuae.org/upload/alam/stail20.gif


ونفس المكان اللي راح نحصل فيه الماوس نسوي لصق لمحتويات التمبلت بدون مانغير ماكان الماوس

http://alamuae.org/upload/alam/stail21.gif

[بوراشد]

الخطوه التاليه معايه برفيووووووو وراح يطلع معاك تمبلت الفروم هوم كامل يعني محتويات الهدر والفاوتر والمجالس كلهم في الاطار وطبعا هذا يعتمد على رغبتك

http://alamuae.org/upload/alam/stail22.gif

الخطوه الأخيره نرفع الصور (( 8 )) لمجلد الــvb
وننقل الكود لتمبلت الــforumhome نفس الخطوات تقدر تطبقها مع تمبلت الـ forumdisplay فقط نرجع للفرونت بيج نسوي تراجع ونحط كود التمبلت ومايحتاي نرفع الصوره وكذلك مع تمبلت الــshowthread


ولاتنسوني و صاحب الموضوع الاصلي بالدعاء و لاعضاء البدر و المشرفين و القائم عليه و للمسلمين

[بنــ بطي ــت]

اخويه بوراشد.....

عيــــني عليك بارده......

الشرح : رائـــــــع ومفصــــل وواضــــــــح

اشكرك جزيل الشكر واتمنى لك التقدم..........

[شعور عابر]

مشكور بوراشد على الطرق