شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا

( ملاحظة: يفضل ان يكون لديك سيرفر شخصي لتجربة الستايل علية)

... * ... * ... * ... * ...... * ... * ... * ... * ...

اولا :
هذة صورة للستايل الاساسي للمنتدى
صورة :

انقر هنا لمشاهدة الصوره بحجمها الطبيعي. الحجم الاصلي لهذه الصوره هو 1024x626 108kb

شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 1

اذا كان هذا الستايل غير موجود لديك فحملة من هنا

...
عند تحميل الستايل فك الضغط عن الملف وادخل داخل المجلد
main
ستجد ثلاث مجلدات:
صورة:

انقر هنا لمشاهدة الصوره بحجمها الطبيعي. الحجم الاصلي لهذه الصوره هو 848x560 80kb

شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 2

الآن أدخل الى مجلد الصور
image
بعد الدخول الية انظر الى الصورة التالية لتعرف ماهي الصور المهمة :
صورة:

انقر هنا لمشاهدة الصوره بحجمها الطبيعي. الحجم الاصلي لهذه الصوره هو 1024x650 113kb

شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 3

الان افتح الصورة
gradient_tcat.gif
بالفوتوشوب

وضع لها اي تدرج يعجبك
( ملاحظة هذة الصورة هي الخلفية لاسم القسم واشياء اخرى...)
{ اذا لم تستطع اضافة تدرج الرجاء اختيار مايلي
صورة :
شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 4

شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 4

}
الآن ضع التدرج الذي يعجبك :

شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 5

بعد وضع التدرج تأكد من مايلي:
شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 5

الن احفظ عملك بتنسيق
GIF
الآن افتح الصورة
gradient_thead.gif
بالفوتوشوب

1-
شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 4

2-
ضع التدرج الي يعجبك (ولكن تأكد من انة يتناسق مع الاول)

شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 7

3-

الآن افتح الصورة
footer.gif
1-
شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 4

2-
ضع التدرج الي يعجبك (ولكن تأكد من انة يتناسق مع الاثنين السابقين)

شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 8

3-

الآن اصبح المنتدى بهذا الشكل :

انقر هنا لمشاهدة الصوره بحجمها الطبيعي. الحجم الاصلي لهذه الصوره هو 1024x625 104kb

شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 9

الان سنحاول تغيير الصورة التي في الاعلى وخلفيتها:
1- افتح مجلد القوالب
شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 10

افتح القالب
header.tpl
بالمفكرة
ثم قم يتحديد الكل crtl+a
ثم انسخة وضعة بالفرونت بيج في مكان الكود البرمجي للصفحة:

سيظهر لك هكذا

انقر هنا لمشاهدة الصوره بحجمها الطبيعي. الحجم الاصلي لهذه الصوره هو 1024x641 135kb

شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 11

الآن اضغط باللون البنفسجي بالاعلى
بزر الفارة اليمن وخاتر مايلي
شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 12

ثم قم يتغيير اللون الى اللون ال1ي يتوافق مع ستايلك
وقم بنسخ الكود البرمجي ولصقة في قالب header.tpl واحفظة...

الان سيصبح المنتدى بهذا الشكل:

شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 13

شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 13

ستلاحظ عدم توافق لون الصورة مع الستايل

الآن قم بالدخول لمجد الصور images
وافتح الصورة logo.jpg
بالفوتوشوب

وقم بعمل تصميم يتوافق مع ستايلك او منتدك
وقم بحفظة بصيغة JPG وسمة logo

سيصبح المنتدى الان هكذا

انقر هنا لمشاهدة الصوره بحجمها الطبيعي. الحجم الاصلي لهذه الصوره هو 1024x620 113kb

شرح تصميم استايل خفيف للمنتدى العربي [ اتحداك لو ما نجحت ] بسييط جداجداجدا 14

الن قد انتهينا من تصميم الستايل
.
.
.
.
.
.

لكن هنالك اشياء لاتتوافق مع لون استايلك

مثل ايقونة ( اضافة موضوع) و (اضافة رد ) و...
الايقونة التي في الاحصائيات السريعة ...

هذة الاشياء تعتمد عليك انت وذوقك

سوف اشرح طريقة تغييرها فقط

اذهب لمجلد الصور :

هذة هي الصور التي يجب عليك تغييرها:
add
وهي ايقونة اضافة موضوع

icon-67_old
وهي ايقونة (المنتدى لايحتوي على مشاركات جديدة)

icon-67_new
وهي ايقونة (المنتدى يحتوي على مشاركات جديدة)

icon-67_lock
منتدى مقفل

new_pm
ايقونة رسالة جديدة في الرسائل الخاصة

reply
اضافة رد

take_copy
اخذ نسخة

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

اذهب لمجلد القوالب
افتح قالب footer
بالفرونت بيج( مثل الطريقة التي في الاعلى header )

واضف حقوقك الية

شبكة الحاسوب السلفية

مشكور خوي على هدا المجهود

الاخ عاشق اجدابيا بارك الله فيك مشاركة قيمة