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

دروس سابقه ..


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

الدرس الأول :

الدرس الأول: شرح الفرنت بيج وتحميل وشرح تركيب منتدى في الجهاز


الدرس الثاني ...


رابط الدرس الأصلي


الدرس الثاني: شرح الفرنت بيج وتحميل وشرح تركيب منتدى في الجهاز l


تصميم الهيدر والفوتر ..

نبدأ في header

الهيدر طريقة تركيبه انواع ..
راح نذكر 3 انواع .. وهي الأسهل ..



النوع الاول..





وضع صورتين من اليسار واليمين بينهم نقطة تمدد ..

نقطه التمدد تعريفها << هي عباره عن تصميم صغير جدا يتكرر ويكمل الهيدر .
تستفيد منها لجعل الستايل يتمدد ..

مثال عليه ..
صفحة سعد الحارثي ..

http://www.upkelk.com/sports/11/1.html




في البدايه ..

نذهب لمسار برنامج الاباتشي الي حملت عليه المنتدى ..

وتضغط على ملف vb
وتقوم بصنع مجلد جديد بداخله بأسم upkelk او اي اسم تريد ..

وتصنع مجلد اخر بداخل مجلد upkelk بـأسم images ونضع فيه صور الهيدر ..



الان
ندخل 1-لوحة التحكم .. ومن ثم 2-التحكم في الستايلات .. وبعدها 3-تختار الستايل الي راح تصمم عليه .. ثم 4-تعديل القوالب ..
و5-تبحث عن قالب اسمه header

انسخ مافيه ..

وأذهب لبرنامج الفرنت بيج ..

سوف تجد خيارات في الاسفل .. أضغط على HTML

سوي تحديد الكل .. واحذفه ..


وألصق الي نسخت فيه ..

ارجع للخيار الي اسمه عادي .. بجانب HTML

راح تحصل صور الهيدر السابقه على شكل اكس ..
أحذفها
ضع جدول جديد ..


المشار عليه رقم 1 في الصوره ,,
هيا الخيارات التي تستطيع ان تتحكم في الصوره تريدها في اليسار او اليمين او الوسط ..

والمشار عليه بـ2 في الصوره ..
هي الجداول التي تضعها ..
من الافضل جدول واحد لا اكثر ..

ومن خصائص الجداول ..




يجب عليك تحديد الحدود الى صفر ..
وكذلك توسيط الحدود




الان ضع الصوره الي تعبر عن نقطة التمدد ..


خصائص الخليه <<<< وهيا صوره صغيره تكون قد صممتها تتكرر في كل تلقائيا ..





في هذه الصوره وضعت نقطة التمدد والصوره في اليسار..



الان أضغط على الصوره التي تريد ان تضعها يسار وتختار الزر الي يشير لليسار ..
واضغط على الصوره الي تريدان تكون في اليمين ..

وبكذلك راح تكون ركبت الهيدر ..

مبرووووووك ..

الان انسخ ماوضعت

وألصقه في الهيدر ..






الفوتر

الفوتر نضع فيه ماوضعنا في الهيدر ..

ويفضل ان يكون تصميم مختصر وسهل وصغير ..

وكذلك .. يكون أسفل الأكواد الأفتراضيه الموجوده سابقا في الفوتر ..




النوع الثاني..


صوره في الوسط ..



مثال عليها ..
ستايل منتديات تشكيلي أبكيلك السابق .



وهو صوره واحده في الوسط ..

فقط تحتاج جدول .. وتضع فيها الصوره ..
وتنسخه وتضعه في الهيدر ..
سهله جدا ..



النوع الثالث ..



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

وهي سهله ايضا ..
فقط تضع جدول ..
وتضع صوره في اليسار وصوره في اليمين ..


والنوع الرابع ..

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

مثال عليها ..,

صفحة ياسر القحطاني ..


http://www.upkelk.com/sports/20/1.html




التمدد هذه الصوره

((( )))

تضعها وتضع فوقها الصوره وتوسطها ..


الدرس سهل جدا ..


ملاحظات ..

1- يلاحظ كثرة التقطيع في الفوتر والهيدر ..
هذا يسبب كثره صور وثقل في المنتدى ..؟!
وكذلك كثره الجداول ..
لذا يكتفى بصوره واحده .. او صورتين من دون تقطيع وخربطه :D

2- الدرس لم ينتهي .. فأسألتكم هيا الدرس الحقيقي ..


الدرس القادم وهو الاهم ..

هو كيفية . وضع الاشكال الجماليه في النافبار .. والفروم هوم .. وغيرها من القوالب المهمه بداخل الستايل ..


الان ارجو من المسجلين التطبيق ..

وعرض الهيدر والفوتر الي صمموه ..
وتركيبه ..

....

تحياتي ..
المصدر:http://www.traidnt.net/vb/showthread.php?t=807866

بسم الله الحمن الرحيم ..

كيفية تركيب الجداول في الستايل , تركيب الصور في الناف بار , تركيب الصور في navbar ,FORUMHOME





الدروس السابقه ..

• الدرس الأول شرح الفرنت بيج وتحميل تركيب منتدى في الجهاز

• التسجيل في دورة تقطيع الستايل وتركيبه

• الدرس الثاني: شرح تركيب الهيدر والفوتر عن طريق الفرنت بيج وتركيبه في الستايل

• يتبع الدرس الثاني [ِشرح] وضع روابط ((التحكم , الاعضاء , البحث , التسجيل الخ في الهيدر

اولا نعتذر من تأخر الدرس لأشغالي الخاصه ..


وكذلك جلست يومين مو عارف كيف اوصل الصوره بطريقه سهله .. وماتتعبني كثير

لاني شفت كثير دروس غير كامله ..
المهم قررت .. اني

أشرح تركيب الصور في قالب الناف بار ..
وهي نفسها في اكثر القوالب الاخرى ..

فقط القوالب الاخرى راح أحدد القالب بالضبط وتقوم بنفس الطريقه ..

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

القوالب الي من الممكن ان تغير عليها هيا ..؟



راح نبدأ في الناف بار ..

في البدايه راح نصمم شكل كما في هذا الشكل ونقطعه



ثانيا ..

لا تنسى ..
ان يكون مكان الصور في المجلد الذي صنعته في الدرس السابق ..


لوحة التحكم >> الستايلات >> الستايل الافتراضي >> الناف بار

تقوم بنسخ الناف بار ..
أفتح الان الفرنت بيج .. تجد الخيار في الاسفل هوتمل أضغط عليه


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


حدد ماحدد في الصوره .. وانسخه ..


بعد نسخه امسح ماحدد وضع بمكانه جدول جديد ..
الان نحن نريد ان نركب ماقطعناه ..
لاحظ معي ..
انت تريد ان تضع الصور حول القالب لذلك يجب ان يكون القالب في الجدول الذي في الوسط ..
تختار 9 جداول
كما في الصوره ..
في الجدول الاوسط ألصق مانسخته سابقا ..


وقم بتركيب الصور ..
في البدايه ضع الزوايا .

فقد تختار الصوره وتضعها في المربع المناسب ..


بعد ماتضع الزاوايا ..
الجداول الاخرى تجب ان تكون ممدده ..

تضغط الزر الايمن من الفاره .. وتختار

خصلئص الخليه >> واستعراض وتختار الصوره التي في الأعلى وموافق ..
وهي راح تتمدد ..
وضع باقي الصور نفس الطريقه ..



حتى تكتمل كل الجداول


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

بذلك تكون قدد ركبت الصور في الناف بار ..

الان احذف حجم الحدود اجعل قيمتها صفر
خصائص الحدود >>


بكذا اكتمل التركيب

اذهب لخيار الهوتمل

وانسخ مافيه والصقه في الناف بار

وبكذا تطلع النتيجه



الان عرفت الطريقه ..





راح تقوم فيها في باقي القوالب ..

القوالب التي من الممكن ان تقوم بتعديلها ..

FORUMDISPLAYالجدول الاول



الجدول الثاني


FORUMHOME


forumhome_forumbit_level1_nopostالجدول باكمله ..

يوجد العديد من القوالب التي في الامكان تركيب الصور عليها ..

مثل
SHOWTHREAD

ولكن من الافضل عدم الاكثار من الصور


الموضوع متشعب قليلا ..

ولكن حاولت ان اوصل المعلومه وانت من تطور المعلومه


انتهى الدرس ..


الدرس القادم ..

يتكلم عن CSS وكيفية تلوين الستايل .. ..

تحياتي ..
المصدر :http://www.upkelk.com/vb/t26245.html