العودة   منتديات ساسو سوفت - Sasosoft Forums > أقسام تطوير المواقع و المنتديات - Departments Develop Websites & Forums > ركن تطوير منتديات vb3.8.0
ركن تطوير منتديات vb3.8.0 اضافات.هاكات.شروحات لوحة التحكم ...(( ويمنع وضع نسخ vBulletin ))

الرئيسيــــة استرجاع كلمة المرور دليـل الموقــع أكواد الألــوان

إضافة رد
 
أدوات الموضوع انواع عرض الموضوع
منتديات ساسو سوفت - Sasosoft Forums
قديم منذ /22-02-2009, 11:21 PM   #1

الروند
 
الصورة الرمزية الروند

:: عضو خبير ::

الروند غير متواجد حالياً

 رقم العضوية : 9
 تاريخ التسجيل : 11 - 2 - 2009
 المشاركات : 2,731
 النقاط : الروند is on a distinguished road
 تقييم المستوى : 65

Lightbulb [3] دورة تصميم استايل vCar*3 و تركيبه بالكامل .. إنشاء الجداول و تركيبها في السكربت

<*iv align="right">السلام عليكم و رحمة الله و بركاته

أهلاً بكم في الحلقة الثانية من دورة تصميم استايل مكتبة الصور (البطاقات) و تركيبه بالكامل ،،،

* الحلقات السابقة :

[فقط الأعضاء المسجلين والمفعلين يمكنهم رؤية الوصلات . إضغط هنا للتسجيل]
[فقط الأعضاء المسجلين والمفعلين يمكنهم رؤية الوصلات . إضغط هنا للتسجيل]

باسم الله نبدأ :

بعد قيامنا بتقطيع الاستايل و تجهيز صور القطع بالكامل يجب توافر برنامج الفرونت بيج لدينا لإنشاء الجداول و تركيب الصور بداخلها و لتنزيل برنامج الفرونت بيج 2003 :

[فقط الأعضاء المسجلين والمفعلين يمكنهم رؤية الوصلات . إضغط هنا للتسجيل]

و من ثم نقوم بفتح برنامج الفرونت بيج :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/01.gif[/IMG]
و بعد ذلك نقوم بإنشاء صفحة جديدة عن طريق الضغط على زر إنشاء الصفحة كما في الصورة :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/02.gif[/IMG]
و من ثم نقوم بالذهاب إلى منطقة الأكواد للصفحة و نقوم بحذف الكود الافتراضي للصفحة كما في الصورة :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/03.gif[/IMG]
و بعد ذلك نقوم بالعودة لمنطقة التصميم Design و نضغط بداخل الصفحة بزر الماوس الأيمن و نقوم باختيار Page Properties خصائص الصفحة كما في الصورة :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/04.gif[/IMG]
و من ثم نقوم بتحديد اتجاه الصفحة من اليمين إلى اليسار كما في الصورة التالية :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/05.gif[/IMG]
بعد ذلك نقوم بإنشاء جدول بثلاثة صفوف و خمسة أعمدة كما في الصورة :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/06.gif[/IMG]

[IMG]http://www.allulu.org/*ros/vcar*-3/03/07.gif[/IMG]
و بعد ذلك سيتم إنشاء الجدول بنجاح .. الآن نقوم بوضع الصور المقطعة كل منها في مكانها المناسب كالتالي :

[1] الصورة العلوية اليمنى المطابقة لعرضها للعامود الأيمن بداخل الخلية اليمنى العلوية
[2] الصورة التي تليها اليمنى أيضاً بداخل الخلية اليمنى التي تليها أيضاً
[3] الصورة المتوسطة بداخل الخلية الوسطى الثالثة
[4] الصورة اليسرى بداخل الخلية اليسرى قبل الأخيرة
[5] الصورة العلوية اليسرى المطابقة لعرضها للعامود الأيسر بداخل الخلية اليسرى العلوية

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

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/08.gif[/IMG]
الآن نقوم بتوسيط الصورة الوسطى العلوية و السفلية بالضغط عليها و محاذاتها بالوسط عن طريق زر التوسيط كما في الصورة :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/09.gif[/IMG]
و بعد ذلك نقوم بالضغط بزر الماوس الأيمن على الصورة الوسطى العلوية و نقوم باختيار Cell Properties خصائص الخلية كما في الصورة :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/010.gif[/IMG]
و بعد ذلك نقوم بتحديد العرض إلى 100% و نقوم باختيار صورة التمدد العلوي كخلفية و للتطبيق اتبع ما في الصورة التالية :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/011.gif[/IMG]
الآن نقوم بتطبيق نفس العمل للمنطقة السفلية بتحديد العرض 100% و صورة التمدد السفلية كخلفية .. بعد ذلك سيكون لدينا الشكل التالي :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/012.gif[/IMG]
الآن نقوم بدمج الأعمدة الثلاثة الوسطى في الصف الثاني عن طريق تظليلهم و من ثم الضغط بزر الماوس الأيمن على التظليل و اختيار Merge Cells دمج الأعمدة كما في الصورة :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/013.gif[/IMG]
الآن نقوم بوضع صورة العامود الأيمن كخلفية للخلية اليمنى في الصف الثاني عن طريق الضغط بداخل الخلية بزر الماوس الأيمن و اختيار Cell Properties خصائص الخلية و نقوم بتحديد العرض (عرض صورة العامود) بالبكسل و صورة العامود كخلفية كما في الصورة :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/014.gif[/IMG]
و بنفس الطريقة للعامود الأيسر في الخلية اليسرى .. و بعد ذلك يصبح لدينا الشكل النهائي التالي :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/015.gif[/IMG]
<*iv align="center">:: نقل الكود إلى السكربت ::
بعد أن قمنا بإنشاء الجداول نقوم بالذهاب لمنطقة الأكواد و من ثم نقوم بتغيير مسار جميع الصور لمسار مجلد الصور بداخل السكربت فقط أي لا نقوم بكتابة الامتداد بالكامل و لكن فقط نبدأ بكتابة المسار باسم المجلد الموجود بداخل مجلد السكربت و على سبيل المثال :

مثال [1] : مجلد الصور اسمه : allulu-style موجود بداخل مجلد السكربت vcar* فنكتب المسار كالتالي :

اقتباس:
allulu-style/image1.gif
مع مراعاة أن allulu-style هو اسم مجلد صور استايلك و image1.gif اسم كل صورة

مثال [2] : مجلد الصور اسمه : allulu-style موجود بداخل مجلد images الموجود بداخل مجلد السكربت vcar* فنكتب المسار كالتالي :

اقتباس:
images/allulu-style/image1.gif
مع مراعاة أن allulu-style هو اسم مجلد صور استايلك و image1.gif اسم كل صورة

و أنا عندي مجلد صور الاستايل اسمه allulu-style بداخله صور الاستايل و موجود بداخل مجلد السكربت مباشرة و قمت بتغيير المسارات كما في الصور التالية :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/016.gif[/IMG]
الآن نقوم بالدخول إلى لوحة تحكم السكربت عن طريق الرابط :

اقتباس:
[فقط الأعضاء المسجلين والمفعلين يمكنهم رؤية الوصلات . إضغط هنا للتسجيل]
your*omain = اسم موقعك
.com = الدومين الخاص بك
vcar* = اسم مجلد السكربت
a*min = لوحة تحكم الإدارة

و من ثم من القائمة اليسرى نقوم بالدخول إلى تحرير القوالب كما في الصورة التالية :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/017.gif[/IMG]
و بعد ذلك نقوم بالضغط على تحرير بجانب القالب page_hea*er .. و من ثم نقوم بنسخ الكود العلوي من الفرونت بيج من منطقة الأكواد و هو الكود المظلل كما في الصورة التالية :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/018.gif[/IMG]
و نقوم بوضعه في المنطقة المحددة في الصورة التالية :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/019.gif[/IMG]
أي ما بين :

رمز Co*e:
${htmlbo*y}
و :

رمز Co*e:

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

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/020.gif[/IMG]
و من ثم نقوم بالضغط على تحرير بجانب القالب page_footer و نقوم بوضع الكود السفلي في المنطقة المحددة كما في الصورة التالية :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/021.gif[/IMG]
أي ما بين :

رمز Co*e:

و :

رمز Co*e:

أي نضعه قبل نهاية كود المحتوى الكامل bo*y و من ثم نضغط تحديث لتحديث القالب .. و بعد ذلك نذهب للصفحة الرئيسية للسكربت و نجد بأن الاستايل قد تم تركيب و تنسيقه بنجاح و لله الحمد كما في الصور التالية :

من الأعلى :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/022.gif[/IMG]
من الأسفل :

<*iv align="center">[IMG]http://www.allulu.org/*ros/vcar*-3/03/023.gif[/IMG]
تابعونا في الحلقات القادمة لتنسيق الألوان و الأقسام .. أتمنى التوفيق للجميع و إن كان هناك خطأ بالشرح فالعذر من الله ثم منكم و أي استفسار أنا حاضر إخواني .. أخوكم و محبكم AhMeD :icon31:




  رد مع اقتباس
إضافة رد

مواقع النشر (المفضلة)

أدوات الموضوع
انواع عرض الموضوع

تعليمات المشاركة
لا تستطيع إضافة مواضيع جديدة
لا تستطيع الرد على المواضيع
لا تستطيع إرفاق ملفات
لا تستطيع تعديل مشاركاتك

BB code is متاحة
كود [IMG] متاحة
كود HTML معطلة

الانتقال السريع

المواضيع المتشابهه
الموضوع كاتب الموضوع المنتدى مشاركات آخر مشاركة
[ دورة ] [ دورة تصميم المواقع من الصفر ] 7 تحميل برنامج A*obe DreamWeaver CS5 Mi**le وجدي ابوالليل منتدى البرمجة 0 13-05-2011 02:22 PM
دورة في تصميم ستايل إلى تركيبه بالمنتدى fruit منتدى دروس وشروحات تصميم الاستايلات 0 20-11-2010 11:28 PM
[4] دورة تصميم استايل vCar*3 و تركيبه بالكامل .. تنسيق الاستايل CSS الروند ركن ستايلات النسخة الثالثة 0 26-02-2009 09:15 PM
[2] دورة تصميم استايل vCar*3 و تركيبه بالكامل .. تقطيع الاستايل الروند ركن تطوير منتديات vb3.8.0 0 22-02-2009 11:21 PM
[1] دورة تصميم استايل vCar*3 و تركيبه بالكامل .. تصميم الاستايل و زخرفته الروند ركن تطوير منتديات vb3.8.0 0 22-02-2009 11:21 PM

RSS RSS 2.0 XML MAP

الساعة الآن 05:08 AM.


Powered by vBulletin Version 3.8.8
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd

جميع المشاركات المنشورة فى المنتدى لا تعبر عن وجه نظر الإدارة

Please dont post any copyrighted materials like cracks , serials , nulled products .. ETC