السلام عليكم ورحمة الله وبركاته


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

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



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




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



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



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

الان توجه الى ديزاين .. تصميم كما في الصوره




الا نقوم بعمل الجدوال كما في الصور 3 جداول



الان نقوم بعديل على الجداول
كلك يمن على الجداول و اختر الموضح في الصوره التاليه



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




الان كلك يمن على الجدول العلوي فقط واختر كما في الصوره
هذا الخيار لأضافة خلفية الهيدر مع الفوتر




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



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

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



تابع





قم بتحديد التقسيم الى 3 جداول كما في الصوره

بعد العمل يصبح الشكل كتالي




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




ليصبح الشكل كتالي




الان توجه الى التعليمات البرمجيه او الكودات

نقوم بتغير مسار الصور الى الشكل التالي



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

الان الشكل النهائي



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

الان نقوم بتركيب الاستايل على المنتدى توجه الى لوحة التحكم ثم التحكم بالاستايلات




ثم من خيارات الاستايل اختر القوالب الشائعه
كما في الصوره



في قالب الهيدر اذف القالب فقط الكود التالي لاتحذفه


كود PHP:

$spacer_open
$_phpinclude_output
$ad_location[ad_header_end]

ضع كود الهيدر اعلى الكود السابق

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

الشكل النهائي





هنا ينتهي درسنا انتضر الدرس الثالث
باتوفق اخوكم بحريني
http://www.bahrainvb.net/vb/showthre...=1930#post1930