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

  #1  
قديم 02-23-2009, 12:50 AM
الصورة الرمزية العاشق 2005  
رقـم العضويــة: 365
تاريخ التسجيل: Sep 2008
المشـــاركـات: 94,808
نقـــاط الخبـرة: 85
افتراضي [3] دورة تصميم استايل vCard3 و تركيبه بالكامل .. إنشاء الجداول و تركيبها في السكربت

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

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

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

[1] الحلقة الأولى .. تصميم الاستايل و زخرفته
[2] الحلقة الثانية .. تقطيع الاستايل

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

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

اضغط هنا

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


و بعد ذلك نقوم بإنشاء صفحة جديدة عن طريق الضغط على زر إنشاء الصفحة كما في الصورة :


و من ثم نقوم بالذهاب إلى منطقة الأكواد للصفحة و نقوم بحذف الكود الافتراضي للصفحة كما في الصورة :


و بعد ذلك نقوم بالعودة لمنطقة التصميم Design و نضغط بداخل الصفحة بزر الماوس الأيمن و نقوم باختيار Page Properties خصائص الصفحة كما في الصورة :


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


بعد ذلك نقوم بإنشاء جدول بثلاثة صفوف و خمسة أعمدة كما في الصورة :




و بعد ذلك سيتم إنشاء الجدول بنجاح .. الآن نقوم بوضع الصور المقطعة كل منها في مكانها المناسب كالتالي :

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

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


الآن نقوم بتوسيط الصورة الوسطى العلوية و السفلية بالضغط عليها و محاذاتها بالوسط عن طريق زر التوسيط كما في الصورة :


و بعد ذلك نقوم بالضغط بزر الماوس الأيمن على الصورة الوسطى العلوية و نقوم باختيار Cell Properties خصائص الخلية كما في الصورة :


و بعد ذلك نقوم بتحديد العرض إلى 100% و نقوم باختيار صورة التمدد العلوي كخلفية و للتطبيق اتبع ما في الصورة التالية :


الآن نقوم بتطبيق نفس العمل للمنطقة السفلية بتحديد العرض 100% و صورة التمدد السفلية كخلفية .. بعد ذلك سيكون لدينا الشكل التالي :


الآن نقوم بدمج الأعمدة الثلاثة الوسطى في الصف الثاني عن طريق تظليلهم و من ثم الضغط بزر الماوس الأيمن على التظليل و اختيار Merge Cells دمج الأعمدة كما في الصورة :


الآن نقوم بوضع صورة العامود الأيمن كخلفية للخلية اليمنى في الصف الثاني عن طريق الضغط بداخل الخلية بزر الماوس الأيمن و اختيار Cell Properties خصائص الخلية و نقوم بتحديد العرض (عرض صورة العامود) بالبكسل و صورة العامود كخلفية كما في الصورة :


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


:: نقل الكود إلى السكربت ::

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

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

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

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

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

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


الآن نقوم بالدخول إلى لوحة تحكم السكربت عن طريق الرابط :

اقتباس:
http://www.yourdomain.com/vcard/admin
yourdomain = اسم موقعك
.com = الدومين الخاص بك
vcard = اسم مجلد السكربت
admin = لوحة تحكم الإدارة

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


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


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


أي ما بين :

رمز Code:
${html****}
و :

رمز Code:

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


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


أي ما بين :

رمز Code:

و :

رمز Code:

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

من الأعلى :


من الأسفل :


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


الذين يشاهدون محتوى الموضوع الآن : 1 ( الأعضاء 0 والزوار 1)
 
أدوات الموضوع
انواع عرض الموضوع

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

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

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

المواضيع المتشابهه للموضوع [3] دورة تصميم استايل vCard3 و تركيبه بالكامل .. إنشاء الجداول و تركيبها في السكربت:
الموضوع كاتب الموضوع المنتدى مشاركات آخر مشاركة
[4] دورة تصميم استايل vCard3 و تركيبه بالكامل .. تنسيق الاستايل CSS العاشق 2005 قسم الأرشيف والمواضيع المحذوفة 0 02-26-2009 10:30 PM
[2] دورة تصميم استايل vCard3 و تركيبه بالكامل .. تقطيع الاستايل العاشق 2005 قسم الأرشيف والمواضيع المحذوفة 0 02-23-2009 12:50 AM
[1] دورة تصميم استايل vCard3 و تركيبه بالكامل .. تصميم الاستايل و زخرفته العاشق 2005 قسم الأرشيف والمواضيع المحذوفة 0 02-23-2009 12:50 AM
[ دورة ] إنشاء مدونة ( wordpress ) على إستضافة مجانية (شرح بالصور من الأف إلى الياء ) Al3asq قسم الأرشيف والمواضيع المحذوفة 0 09-12-2008 08:26 PM
جميع دروس دورة إنشاء المواقع و المنتديات Al3asq أرشيف قسم البرامج 0 09-10-2008 01:41 PM

الساعة الآن 11:16 PM.


Powered by vBulletin® Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.

كُل ما يُكتب أو يُنشر في منتديات العاشق يُمثل وجهة نظر الكاتب والناشر فحسب، ولا يمثل وجهه نظر الإدارة

rel="nofollow" maxseven simplicity and clarity