said
11-01-2013, بتوقيت غرينيتش 03:09 AM
http://www.dzbatna.com/images/icons/iconrote.gif [ ط´ط±ط* ] طھطµظ…ظٹظ… ظˆطھط±ظƒظٹط¨ ط§ط³طھط§ظٹظ„ ظ„ط¨ط±ظ†ط§ظ…ط* ط§ظ„ظ…طھظ‚ط¯ظ… ظ„ط®ط¯ظ…ط§طھ ط§ظ„ظ…ظˆط§ظ‚ط¹ [ AM4SS ] (http://www.dzbatna.com/t1550528/)
بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته
شرح طريقة تصميم وتركيب install استايل style لبرنامح المتقدم لخدمات المواقع بـ 28 صوره بالتفصيل الممل
لمن يواجهه صعوبه في تركيب install تصميم خاص به ولشركته لسكربت
الشرح طريقة اهداء :
لمبرمج السكربت : محمد الشرقاوي
جميع مستخدمي السكربت
ادارة واعضاء ديزاد باتنة
الجزء الاول
تصميم الاستايل style ببرنامج بالفتوشوب
قص الاستايل style ببرنامج بالفتوشوب
الصور النهائيه للتصميم وتجهيز التركيب install
الجزء الثاني
تركيب install الهيدر header والفوتر
الجزء الثاني
تركيب install البلوكات - يمين - يسار - وسط
سوف نقوم بشرح طريقة تصميم استايل style غير ممدد
معلومات عامة :
نقوم بعمل التصميم كأي تصميم استايل style منتدى
بالطريقة المعتداه وبالشكل الذي تراه مناسب
ولا فرق بينهم بما انك تصمم استايل style وتركب استايل style منتدى سوف تقوم بتركيب install وتصميم الاستايل style لسكربت المتقدم لخدمات الويب
مقاسات التصميم
العرض : 890 بكسل العرض الذي سوف تكون بالتصميم النهائي
الطول : 500 بكسل ولك الحريه على التصميم
بسم الله نبداء
تابع الصوره التاليه قبل قص التصميم وانما التصميم الذي تما اختياره لشرح طريقة التركيب install والتصميم
http://upload.dzbatna.net/upfiles/LlB58709.gif
بالصوره السابقه ظهر لنا الشكل النهائي للتصميم وتم توزيع الخطوط للقسم واعتمام القس عليه
بالصوره التاليه
قص التصميم وتجهيزه للتركيب install
http://upload.dzbatna.net/upfiles/lM258854.gif
وطريقة حفظ التصميم معروفه ولكن سوف اقوم بشرح طريقةها
انا استخدم فتوشوب 8 العربي
طريقة حفظ التصميم كتالي
ملف ثم
حفظ للويب
سوف تظهر الصوره التاليه
http://upload.dzbatna.net/upfiles/xBW58995.gif
نختار اسم الصور
نختار كما بالصوره السابفة
والصوره التاليه للتوضيع
http://upload.dzbatna.net/upfiles/7Vh59108.gif
الصوره السابقة للتوضح والشكل النهائي للتصميم
ننتقل للحزاء الثاني
نقوم بتحمل الاستايل style الذي قمت بتصميمه للسكربت والذي قام المبرمج للسكربت محمد الشرقاوي بتعديل القوالب وتصحيح الاخطاء على الرابط التالي
am4ss_styles.rar (http://am4ss.com/am4ss_tools/styles/am4ss_styles.rar)
ثم نقوم برفع الاستايل style داخل مجلد السكربت في مجلد
templates
نقوم بعمل صوره توضيحية وتحديد
الهيدر header
والفوتر
وتحديد قائمة بلوك - يمين- يسار - وسط
كما بالصوره التاليه
http://upload.dzbatna.net/upfiles/cSO21833.gif
ثم نقوم بتغير اسمه لاي اسم او بنفس الاسم ولك حرية الاختيار
انا قمت بتغير مجلد السكربت الاسم
test
كما بالصوره التاليه
http://upload.dzbatna.net/upfiles/TZl21909.gif
نقوم بحذف الصور الخاصة باستايل style السكربت الذي قمنا بتحميله
اضافة صور التصميم الخاصه بالتصميم
كما بالصوره التاليه
http://upload.dzbatna.net/upfiles/Ku522749.gif
نحدث صفحة السكربت بعد استبدال الصور
وظهر لنا صفحة السكربت كما بالشكل التالي
صورة توضيحية
http://upload.dzbatna.net/upfiles/lDV23001.gif
نقوم بفتح مجلد التصميم الذي تم اختياره سابقا ليكون مجدل التصميم الخاص فيه
سوف اقوم بذكر اسماء الملفات الخاصه بالتعديل
am4ss.css
المف الخاص بتعديل خطوط السكربت والوان الخطوط والخلفيه الخارجيه
header.tpl
الملف الخاص بتعديل الهيدر header والخلفيه الداخليه
footer.tpl
الملف الخاص بتعديل الفوتر
templates.php
الملف الخاص بتعديل البلوكات - يمين - يسار - وسط
صوره توضيحة لختيار هذه الملفات
http://upload.dzbatna.net/upfiles/g5l23126.gif
اول نقوم بفتح ملف
header.tpl
باي محرر لديك وانا استخدم برنامج الفرنت بيج
صوره توضيحة
http://upload.dzbatna.net/upfiles/ner23676.gif
نحذف الصوره السابقة ونستبدلها بالصور الخاصه بالتصميم الجديد
لو كان الهيدر header صوره واحده كما عملت في هذا الدرس مفصل
ولو كان لديك اكثر من صوره
يمكنك اضافتها داخل المربع
وتوزيع الهيدر header بالشكل الذي تريده
واضافة الرابط التشاعبيه التي تريدها
صورة توضيحية
http://upload.dzbatna.net/upfiles/oqY23845.gif
تقوم بالذاهاب الا تعليمات برمجية وشرح طريقة جميع ما هو مهم ونقوم بالتعديل عليه وما يهمنا
الشرح طريقة بالصوره التوضيحية التاليه
http://upload.dzbatna.net/upfiles/5fN24028.gif
بعد ما نقوم بالتعديلات اللازمه سوف
ونشاهدها بالصورها التاليه التي تم تنسيقها للتصميم النهائي للهيدر
ملاحظه : من هنا يمكنك تحديد عرض التصميم
http://upload.dzbatna.net/upfiles/Hko24331.gif
نقوم بحفظ القالب template ونحدث ونرفعه للموقع ونشاهد التصميم والتاكد من تركيب install الهيدر header بالشكل الصحيح
صوره توضيحيه
http://upload.dzbatna.net/upfiles/dS424555.gif
بحمد لله تم تركيب install الهيدر header بنجاح
سوف تقوم بتركيب install الفوتر
نفتح ملف
footer.tpl
الملف الخاص بتعديل الفوتر
نشاهد الصوره ونقوم بعمل التعديلات اللازمه تم شرح طريقة التعيل
مع مراعاة بان تكون صوره الهيدر header هي متمدهه مع امكانيه اضافة صوره ثابته
http://upload.dzbatna.net/upfiles/cJi24775.gif
تم بحمد الله الانتهاء من شرح طريقة تركيب install الجزء الثاني الهيدر header والفوتر
ننتقل للجزاء الثالث
نقوم بفتح صفحة جديد بالفرنت بيج
ونحذف ما هو محدد كما بالصوره التالية
http://upload.dzbatna.net/upfiles/Vi133544.gif
نقوم بادراج الجداول على حسب قص البلوك في الدرس مفصل الاول
تم قص التركيب install على ان يكون
عدد 5 صور افقي
وطول 3 عمودي
ملاحظه مهمه : الجداول يتم ارداجها على حسبب تصميمك
ان كان تصميم للبوك الجزء العلوي 3 صور يمنك اضافة 3 جداول افقي
وان كان اربعه صور اضافة 4 جداول وهكذا
نقوم بادراج الجداول المطلوبه كما بالصوره التاليه
http://upload.dzbatna.net/upfiles/oZH33918.gif
الان نقوم بتوزيع الصور داخل الجداول كما هو مطلوب شكل البلوك
مع مراعاة منطقة التمدد تكون الصوره خلفيه للجدول الخاص بمنطقة التمدد
وقد تواجهك مشكله تشوه التصميم وحلها اضافة فوق منطقة جزء بعرض صغير لمنطقة التمدد التي بالاسفل
ودمج الجداول الي بنص التي لا تلزمنا
سوف نشاهدها بالصوره التاليه
http://upload.dzbatna.net/upfiles/Rqi34061.gif
صوره توضيحة لتحديد اسم البلوك ومحتوى البلوك
http://upload.dzbatna.net/upfiles/t5O36708.gif
نقوم بفتح ملف
templates.php
باي محر تريد
وسوف اقوم بشرح طريقة كل ما بداخله وهذا الصوره - ارجو التركيز مهم فهم ما بداخله
يمكنك ضع تصميم بلوك يمين يسار موحد
وبلوك وسط بتصميم اخر
او جميعا بتصميم واحد
http://upload.dzbatna.net/upfiles/5NM34423.gif
نقوم بحذف صور التصميم السابق وتجهيز الملف للتصميم الجديد
تم تحديد بخلفيه الون الي خلفيته لون الاحمر
لا تقم بحذفها ابدا والا لن يظهر التصميم
الي خلفيته لون اخضر
تم استبداله بهذه الجمله للتوضيع
وهذا ما يتم استبداله بالتصميم الجديد وسوف نتابع هذا في بقية الشرح طريقة
اما الي خلفيته لون الاصفر
عباره عن عنوان البولكات ولون خط البلوكات على حسب تصميمك يمكنك وضع الون الذي يناسبك
نقوم بنسخة
وهذه الصوره لتوضيع
http://upload.dzbatna.net/upfiles/Hvh34657.gif
بعد ما قمنا بعمل السابق نرجع لتصميم البلوكات بالفرنت بيج
نقوم بلصق ما قمنا بنسخه من الصوره السابقة
واضافة بدل اسم البلوك
وتحديد مسارت الصور الصحيحة وتجهز البلوكات لتركيب install
نشاهد الصوره
http://upload.dzbatna.net/upfiles/icR35319.gif
نتابع الصورة التاليه بعد ما قمنا بتعديل مسارت الصور
وتجهيز فصل بداية ونهاية البلوك
صورة للتوضيح
http://upload.dzbatna.net/upfiles/Lim35695.gif
الان نقوم بفصل بداية البلوك ونهاية البلوك وتحديد الاكواد المطلوبة
كما بالصورة التالية
http://upload.dzbatna.net/upfiles/jL535871.gif
صورة توضيحة لتاكد من التصميم
http://upload.dzbatna.net/upfiles/X6636139.gif
نقوم باضافة
الاكود code لملف
templates.php
كما بالصوره التالية
http://upload.dzbatna.net/upfiles/8wc36233.gif
نخفظ الملف ونرفعه داخل مجلد التصميم ونحدث الصفحة ونشاهد التصميم
كما بالصورة التالية
http://upload.dzbatna.net/upfiles/E4g36502.gif
البرامج المستخدمه :
سيرفر SERVER شخصي لتركيب install السكربت
الفتوشوب لتصميم والقص
الفرنت بيج لتركيب install
الموضوع الاصلي كل جزاء على حده
الجزء الاول (http://am4ss.com/lessons.php?do=read&id=20)
الجزء الثاتي (http://am4ss.com/lessons.php?do=read&id=22)
الجزء الثالث (http://am4ss.com/lessons.php?do=read&id=23)
صور الشرح طريقة بالمرفق
اعتذر عن لكثرة الصور ولعدم ترتيب الموضوع ولكن تم وضعه لتعم الفائده
الشرح طريقة اعداد شخضي
اعداد الشرح طريقة اخوكم : ادميرال
لا تنسونا من دعائكم
اي استفسار حياكم الله
في رعاية الله
ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)
الملفات المرفقة
http://www.traidnt.net/vb/images/attach/zip.gif AM4SS.zip (http://www.traidnt.net/vb/attachments/480960d1272839418-am4ss.zip) (1.11 ميقابايت, عدد مرات المشاهدة 619 مرة)
https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©
بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته
شرح طريقة تصميم وتركيب install استايل style لبرنامح المتقدم لخدمات المواقع بـ 28 صوره بالتفصيل الممل
لمن يواجهه صعوبه في تركيب install تصميم خاص به ولشركته لسكربت
الشرح طريقة اهداء :
لمبرمج السكربت : محمد الشرقاوي
جميع مستخدمي السكربت
ادارة واعضاء ديزاد باتنة
الجزء الاول
تصميم الاستايل style ببرنامج بالفتوشوب
قص الاستايل style ببرنامج بالفتوشوب
الصور النهائيه للتصميم وتجهيز التركيب install
الجزء الثاني
تركيب install الهيدر header والفوتر
الجزء الثاني
تركيب install البلوكات - يمين - يسار - وسط
سوف نقوم بشرح طريقة تصميم استايل style غير ممدد
معلومات عامة :
نقوم بعمل التصميم كأي تصميم استايل style منتدى
بالطريقة المعتداه وبالشكل الذي تراه مناسب
ولا فرق بينهم بما انك تصمم استايل style وتركب استايل style منتدى سوف تقوم بتركيب install وتصميم الاستايل style لسكربت المتقدم لخدمات الويب
مقاسات التصميم
العرض : 890 بكسل العرض الذي سوف تكون بالتصميم النهائي
الطول : 500 بكسل ولك الحريه على التصميم
بسم الله نبداء
تابع الصوره التاليه قبل قص التصميم وانما التصميم الذي تما اختياره لشرح طريقة التركيب install والتصميم
http://upload.dzbatna.net/upfiles/LlB58709.gif
بالصوره السابقه ظهر لنا الشكل النهائي للتصميم وتم توزيع الخطوط للقسم واعتمام القس عليه
بالصوره التاليه
قص التصميم وتجهيزه للتركيب install
http://upload.dzbatna.net/upfiles/lM258854.gif
وطريقة حفظ التصميم معروفه ولكن سوف اقوم بشرح طريقةها
انا استخدم فتوشوب 8 العربي
طريقة حفظ التصميم كتالي
ملف ثم
حفظ للويب
سوف تظهر الصوره التاليه
http://upload.dzbatna.net/upfiles/xBW58995.gif
نختار اسم الصور
نختار كما بالصوره السابفة
والصوره التاليه للتوضيع
http://upload.dzbatna.net/upfiles/7Vh59108.gif
الصوره السابقة للتوضح والشكل النهائي للتصميم
ننتقل للحزاء الثاني
نقوم بتحمل الاستايل style الذي قمت بتصميمه للسكربت والذي قام المبرمج للسكربت محمد الشرقاوي بتعديل القوالب وتصحيح الاخطاء على الرابط التالي
am4ss_styles.rar (http://am4ss.com/am4ss_tools/styles/am4ss_styles.rar)
ثم نقوم برفع الاستايل style داخل مجلد السكربت في مجلد
templates
نقوم بعمل صوره توضيحية وتحديد
الهيدر header
والفوتر
وتحديد قائمة بلوك - يمين- يسار - وسط
كما بالصوره التاليه
http://upload.dzbatna.net/upfiles/cSO21833.gif
ثم نقوم بتغير اسمه لاي اسم او بنفس الاسم ولك حرية الاختيار
انا قمت بتغير مجلد السكربت الاسم
test
كما بالصوره التاليه
http://upload.dzbatna.net/upfiles/TZl21909.gif
نقوم بحذف الصور الخاصة باستايل style السكربت الذي قمنا بتحميله
اضافة صور التصميم الخاصه بالتصميم
كما بالصوره التاليه
http://upload.dzbatna.net/upfiles/Ku522749.gif
نحدث صفحة السكربت بعد استبدال الصور
وظهر لنا صفحة السكربت كما بالشكل التالي
صورة توضيحية
http://upload.dzbatna.net/upfiles/lDV23001.gif
نقوم بفتح مجلد التصميم الذي تم اختياره سابقا ليكون مجدل التصميم الخاص فيه
سوف اقوم بذكر اسماء الملفات الخاصه بالتعديل
am4ss.css
المف الخاص بتعديل خطوط السكربت والوان الخطوط والخلفيه الخارجيه
header.tpl
الملف الخاص بتعديل الهيدر header والخلفيه الداخليه
footer.tpl
الملف الخاص بتعديل الفوتر
templates.php
الملف الخاص بتعديل البلوكات - يمين - يسار - وسط
صوره توضيحة لختيار هذه الملفات
http://upload.dzbatna.net/upfiles/g5l23126.gif
اول نقوم بفتح ملف
header.tpl
باي محرر لديك وانا استخدم برنامج الفرنت بيج
صوره توضيحة
http://upload.dzbatna.net/upfiles/ner23676.gif
نحذف الصوره السابقة ونستبدلها بالصور الخاصه بالتصميم الجديد
لو كان الهيدر header صوره واحده كما عملت في هذا الدرس مفصل
ولو كان لديك اكثر من صوره
يمكنك اضافتها داخل المربع
وتوزيع الهيدر header بالشكل الذي تريده
واضافة الرابط التشاعبيه التي تريدها
صورة توضيحية
http://upload.dzbatna.net/upfiles/oqY23845.gif
تقوم بالذاهاب الا تعليمات برمجية وشرح طريقة جميع ما هو مهم ونقوم بالتعديل عليه وما يهمنا
الشرح طريقة بالصوره التوضيحية التاليه
http://upload.dzbatna.net/upfiles/5fN24028.gif
بعد ما نقوم بالتعديلات اللازمه سوف
ونشاهدها بالصورها التاليه التي تم تنسيقها للتصميم النهائي للهيدر
ملاحظه : من هنا يمكنك تحديد عرض التصميم
http://upload.dzbatna.net/upfiles/Hko24331.gif
نقوم بحفظ القالب template ونحدث ونرفعه للموقع ونشاهد التصميم والتاكد من تركيب install الهيدر header بالشكل الصحيح
صوره توضيحيه
http://upload.dzbatna.net/upfiles/dS424555.gif
بحمد لله تم تركيب install الهيدر header بنجاح
سوف تقوم بتركيب install الفوتر
نفتح ملف
footer.tpl
الملف الخاص بتعديل الفوتر
نشاهد الصوره ونقوم بعمل التعديلات اللازمه تم شرح طريقة التعيل
مع مراعاة بان تكون صوره الهيدر header هي متمدهه مع امكانيه اضافة صوره ثابته
http://upload.dzbatna.net/upfiles/cJi24775.gif
تم بحمد الله الانتهاء من شرح طريقة تركيب install الجزء الثاني الهيدر header والفوتر
ننتقل للجزاء الثالث
نقوم بفتح صفحة جديد بالفرنت بيج
ونحذف ما هو محدد كما بالصوره التالية
http://upload.dzbatna.net/upfiles/Vi133544.gif
نقوم بادراج الجداول على حسب قص البلوك في الدرس مفصل الاول
تم قص التركيب install على ان يكون
عدد 5 صور افقي
وطول 3 عمودي
ملاحظه مهمه : الجداول يتم ارداجها على حسبب تصميمك
ان كان تصميم للبوك الجزء العلوي 3 صور يمنك اضافة 3 جداول افقي
وان كان اربعه صور اضافة 4 جداول وهكذا
نقوم بادراج الجداول المطلوبه كما بالصوره التاليه
http://upload.dzbatna.net/upfiles/oZH33918.gif
الان نقوم بتوزيع الصور داخل الجداول كما هو مطلوب شكل البلوك
مع مراعاة منطقة التمدد تكون الصوره خلفيه للجدول الخاص بمنطقة التمدد
وقد تواجهك مشكله تشوه التصميم وحلها اضافة فوق منطقة جزء بعرض صغير لمنطقة التمدد التي بالاسفل
ودمج الجداول الي بنص التي لا تلزمنا
سوف نشاهدها بالصوره التاليه
http://upload.dzbatna.net/upfiles/Rqi34061.gif
صوره توضيحة لتحديد اسم البلوك ومحتوى البلوك
http://upload.dzbatna.net/upfiles/t5O36708.gif
نقوم بفتح ملف
templates.php
باي محر تريد
وسوف اقوم بشرح طريقة كل ما بداخله وهذا الصوره - ارجو التركيز مهم فهم ما بداخله
يمكنك ضع تصميم بلوك يمين يسار موحد
وبلوك وسط بتصميم اخر
او جميعا بتصميم واحد
http://upload.dzbatna.net/upfiles/5NM34423.gif
نقوم بحذف صور التصميم السابق وتجهيز الملف للتصميم الجديد
تم تحديد بخلفيه الون الي خلفيته لون الاحمر
لا تقم بحذفها ابدا والا لن يظهر التصميم
الي خلفيته لون اخضر
تم استبداله بهذه الجمله للتوضيع
وهذا ما يتم استبداله بالتصميم الجديد وسوف نتابع هذا في بقية الشرح طريقة
اما الي خلفيته لون الاصفر
عباره عن عنوان البولكات ولون خط البلوكات على حسب تصميمك يمكنك وضع الون الذي يناسبك
نقوم بنسخة
وهذه الصوره لتوضيع
http://upload.dzbatna.net/upfiles/Hvh34657.gif
بعد ما قمنا بعمل السابق نرجع لتصميم البلوكات بالفرنت بيج
نقوم بلصق ما قمنا بنسخه من الصوره السابقة
واضافة بدل اسم البلوك
وتحديد مسارت الصور الصحيحة وتجهز البلوكات لتركيب install
نشاهد الصوره
http://upload.dzbatna.net/upfiles/icR35319.gif
نتابع الصورة التاليه بعد ما قمنا بتعديل مسارت الصور
وتجهيز فصل بداية ونهاية البلوك
صورة للتوضيح
http://upload.dzbatna.net/upfiles/Lim35695.gif
الان نقوم بفصل بداية البلوك ونهاية البلوك وتحديد الاكواد المطلوبة
كما بالصورة التالية
http://upload.dzbatna.net/upfiles/jL535871.gif
صورة توضيحة لتاكد من التصميم
http://upload.dzbatna.net/upfiles/X6636139.gif
نقوم باضافة
الاكود code لملف
templates.php
كما بالصوره التالية
http://upload.dzbatna.net/upfiles/8wc36233.gif
نخفظ الملف ونرفعه داخل مجلد التصميم ونحدث الصفحة ونشاهد التصميم
كما بالصورة التالية
http://upload.dzbatna.net/upfiles/E4g36502.gif
البرامج المستخدمه :
سيرفر SERVER شخصي لتركيب install السكربت
الفتوشوب لتصميم والقص
الفرنت بيج لتركيب install
الموضوع الاصلي كل جزاء على حده
الجزء الاول (http://am4ss.com/lessons.php?do=read&id=20)
الجزء الثاتي (http://am4ss.com/lessons.php?do=read&id=22)
الجزء الثالث (http://am4ss.com/lessons.php?do=read&id=23)
صور الشرح طريقة بالمرفق
اعتذر عن لكثرة الصور ولعدم ترتيب الموضوع ولكن تم وضعه لتعم الفائده
الشرح طريقة اعداد شخضي
اعداد الشرح طريقة اخوكم : ادميرال
لا تنسونا من دعائكم
اي استفسار حياكم الله
في رعاية الله
ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)
الملفات المرفقة
http://www.traidnt.net/vb/images/attach/zip.gif AM4SS.zip (http://www.traidnt.net/vb/attachments/480960d1272839418-am4ss.zip) (1.11 ميقابايت, عدد مرات المشاهدة 619 مرة)
https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©
