شرح :: تصميم مجلة نيوك

[أبو مايد]

السلام عليكم ورحمه الله وبركاتة
اصبحتم وامسيتم بخير وعافية ان شالله يا أهل سوالف المحترمين

في الموضوع السابق شرحة طريقة تحميل مجلة نيوك على موقعك الخاص
http://www.swalif.net/softs/showthread.php?t=101396

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

سوف نعتمد على مجلد ثيم NukeNews الموجود فالمجلة في صنع ثيمنا الخاص
إين تجد هذا الملجد: html/themes/NukeNews

- يعتمد الثيم على خمس ملفات رئيسية:
1- header.html
2- footer.html
3- blocks.html
4- story_home.html
5- story_page.html
أضغط على الصورة لترى صوة توضيحية لعناصر الثيم


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

-----------------------

ملف: header.html

قم بتحميل ملف header.html الجاهز من هنا
الأن قم بوضع الهيدر في المربع الموضح فالصورة التالية والذي تجد به اسم الموقع (( عرض: 775 )):


----------------------

ملف blocks.html

قم بتحميل ملف blocks.html الجاهز من هنا
الأن قم بإلصاق صور البلوك في اماكنها الموضحة فالصورة التالية:


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

-----------------------

ملف story_home.html

قم بتحميل ملف story_home.html الجاهز من هنا
الأن قم بإلصاق صور المقال في الأماكن الموضحة فالصورة التالية


ملاحظة: يمكنك تغير تقسيم المقال كيفما تشاء بدون الإهتمام الى اي من التفاصيل المذكورة فالملف

------------------------

ملف story_page.html

قم بتحميل ملف story_page.html الجاهز من هنا
الأن قم بإلصاق صور الصفحة الرئيسية للمقال كما هو موضح فالصورة التالية


ملاحظة: يمكنك تغير تقسيم المعال كيفما تشاء بدون الإهتمام الى اي من التفاصيل المذكورة الملف

------------------------

ملف footer.html

قم بتحميل ملف footer.html الجاهز من هنا
الأن قم بإلصاق صور تزيل الموقع في المربع الموضح فالصورة التالية:


-----------------------

ملف left_center.html و center_right.html

هما للفراغ الذي سيكون مابين البلوك والمقال في الصفحة الرئيسية

----------------------

نقطة هامة

لاتنسى بإن الثيم معكوس حيث ستكون الجهة اليمنة فالتطبيق هي الجهة اليسرى فالموقع وذلك لإن اتجاه اللغة العربية معاكس لإتجاه اللغه الإنجليزية
وبإذن سو اوافيكم بالمتغيرات الأخرى فالمقالات القادمة
النهاية
قم برفع جميع هذي الملفات الى مجلد themes/NukeNews/ واجعله الثيم الرئيسي لموقعك عن طريق الدخول الى الخيارات العامه من لوحة التحكم فالموقع
وضع الصور في المكان الذي انته حددته وفي القالب تكون في احد المسارات التالية html/ او html/images
يمكنك طبعاً اختيار المجلد الذي يناسبك وسوف اوضح الطريقة فالدرس القادم
----------------------------------------------------------------

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

[mr_sultan]

ملف story_page.html

قم بتحميل ملف story_home.html الجاهز من هنا
الأن قم بإلصاق صور الصفحة الرئيسية للمقال كما هو موضح فالصورة التالية

مشكووور اخويNothing

شرح ولا اروع وسهل ومفيد جدا جزاك الله خير

بس فيه خطأ بسيط في كلمه شوف فوق
قم بتحميل ملف story_home.html
المفروض تكون قم بتحميل ملف story_page.html
علشان الاخوان مايتوهقون بعدين

وشكراً مجددا على الشرح المميز :nice:

[أبو مايد]

لاشكر على واجب أخوي mr_sultan

وشكرا على التصحيح وقمة بالتعديل

[EISA AHMED]

ماقصرت ياخوي كفيت ووفيت

وهذا الشرح في ملف zip

علشان اذا انحذفت الصور ولا شئ

يكون موجود

:shy:

[ham2002]

مليون شكر لك ياغالي وشرح رائع من شخصكم الكريم

[Alshajjar]

أخي العزيز Nothing لك كل الشكر الجزيل

قد وفقت في شرحك بالدرس الماضي و هذا أيضـاً

إستمر .. في دروس تصميم الثيمز .. إذا انتقلت للمرحلة التالية فإنتظر أسئلتي الفضولية

فإنني لن اتركك :: لدي الكثير منها بالنسبة لتصميم الثيمز مع كوني متوسط الخبرة بهذا

تحياتي
أخوك / الشجّار

[NaIeF]

الله يعطيك العاافيه...

كيف ووفيـت ... ولاتحرمنا من باقي ابداعااتك

[YE4SOFT]

جميل عزيزي

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

[أبو مايد]

اخي Dr.Gix شكراً على مرورك ووضع هذا الدرس في ملف مضغوط بالفعل فكره في محلها فلا احد يعلم ماذا سوف يحصل غداً.

------------------

لاشكر على واجب اخي ham2002 واتمنى ان الشرح افادك

----------------------

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

------------------------

الله يعافيك اخوي NaIeF وشكرا على مرورك

------------------------
الجميل تواجدك اخي vip_sh3 وانا متواصل معكم حتى الأن والحمدالله ولكن التأخير بعض الاحيان مطلوب لاعطاء كل شرح حقه ,, فمن العجله الندامه

--------------------------

وشكرا على تواجدكم الطيب
مع التحيه

[كنتاكي]

الله يعطيك العااافيه حبيبي Nothing :nice: مع اني مااا قريتها لاني ماا افهم في المواااقع و التصااميم و سوااالفهااا لووووووووووول

<<< حددده القرووووب

[المتميز]

مشكور
اخوي
والله يوفقك


تحياتي

[أبو مايد]

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

- - - - - - - - - - - - - -

لاشكر على واجب اخوي o0_6lo0o_0o وعسى انك استفدت

[ArabOasis.Net]

شرح رائع أخوي Nothing والله يعطيك العافية وبالتوفيق ..

[أبو مايد]

الله يعافيك اخوي الواحة العربية وشكرا على مرورك

[PHP Expert]

شكرا أخ NoThinG

وجعله الله في موازين حساناتك