اللهم لك الحمد ، ومنك الفرج ، واليك المشتكي ، وأنت المستعان ، ولا حول ولا قوة الا بك ..
 
  الصحيفة التقنية  | الصفحة الرئيسية  | مركز تحميل مطور  | استخدم ختم مطور  | قوِ موضوعك هام |  أعلن في مُطِّورْ   | شرح السي بانل جديد |  افحص البيج رانك  | دعم فني مجاني RSS Facebook twitter Youtube




العودة   مطور Mtwer > أقسام دورات و دروس مطور المتخصصة > قسم الدروس والدورات العام > إرشيف الدورات > دورة تصميم المجلات الإلكترونية


دورة تصميم المجلات الإلكترونية هذه الدورة لتعلم الطرق الصحيحة لتصميم المجلات الإلكترونية
ملقي الدورة: [vista-design]

عزيزي المطور ابتعد عن النقل، ولتكن مواضيعك جديدة وقيمة تعبر عن إبداعك وتميزك
موضوع مغلق
 
LinkBack أدوات الموضوع انواع عرض الموضوع
  #1  
قديم 04-02-2009, 03:26 PM
الصورة الرمزية vista-design
:: + عضو شرف + ::
الرتبةالرتبةالرتبةالرتبة
 

vista-design يستحق التميز

بيانات موقعي :
اصدار المنتدى : لا أملك منتدى
[joomla4] شرح تصميم الهيدر والفوتر للقالب والتعديل عليه





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

اولا: دعونا نشرح كيفية تصميم الهيدر والفوتر


نفتح الفوتوشوب ,بعدين نسوى عمل جديد بمقاسات 777 عرض فى 666 طول


وانا فى هالمثال راح اصور الشاشة عندى, وراح أخذ الهيدر الخاص بالموقع هنا مطور

وراح اسحبه لاعلى صفحة العمل


وبعدين راح نبدأ بتقطيعه باداة التقطيع

لثلاثة قطع (شمال-وسط -يمين)

شوف.........






ويفضل عند التقطيع ان تجعل مقاس الجزء الايسر=مقاس الجزء الايمن


بعد ما قطعنا


راح نحفظ الشغل


اضغط من فوق على save for web



بعدين نختار save

ونختار مثل الاتى:






بعد الحفظ, راح تجد تكون ملف صور به ثلاث صور


شوف,,,,,,,,,







الحين تمام خلصنا من التصميم, وطبعا الفوتر هو نفس الموضوع





وقم بنسخ السورس الخاص بالقالب index.html



من لوحة تحكم المجلة كما شرحنا سابقا
(template manager>>>>> نختار القالب>>>>>>نضغط على edit index >>>>>ننسخ الكود البرمجى للقالب


ملاحظه: راح اشتغل على قالب JA_Purity الذى يأتى مع المجلة جاهز


الحين افتح برنامج الفرونت بيج front page


ثم انتقل لخانة الcode من اسفل

وقم بلصق السورس البرمجى للقالب


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


شوف.........





الحين نرجع لخانة design من أسفل

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

الجدول الايسر=الصورة اليسرى

الجدول الاوسط=الصورة الوسطى

الجدول الايمن=الصورة اليمنى






بحيث يكون الشكل النهائى هكذا






الحين نركز فى الخطوات القادمة

اولا:عمل الصورة الوسطى كنقطة تمدد, حتى يتمدد الهيدر مع اى مقاس شاشة

1-قف على الجدول الاوسط,ثم اضغط كليك مرتين , راح تفتح خانة’, اختارgeneral من فوق وانسخ رابط الصورة الوسطى






الحين بعد نسخ رابط الصورة الوسطى, نقوم بحذف هذه الصورة من جدولها

ثم وأنت واقف على نفس الجدول الاوسط بعد ما حذفنا الصورة الوسطى الخاصة به

نضغط كليك يمين ونختار cell properties






بعدين نعلم بالاسفل ونقوم بلصق رابط الصورة






ثانيا:بالنسبة للصورة اليسرى واليمنى, راح نجعلها مقاساتها

فى الخلية حتى نساوى مقاس الصورة بمقاس الجدول

شوف,,,,,,,,




اضغط على الصورة اليسرى مرتين, ثم احفظ مقاسات الصورة فى بالك




ثم نضغط على الصورة كليك يمين ونختار cell properties

ثم نلصق المقاسات فى الجداول الموضحه








ثالثا: ازالة حدود الجداول الثلاثة......


قف بالماوس على اى جدول واضغط كليك يمين واختار table properties

ثم سوى الخيارات المشارة كالاتى:






بهيك نكون انتهينا...............




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


وفى النهاية راح تجد الشكل كالاتى على الرئيسية







ملاحظه هامه/: لازم تكون شغال على متصفح الانترنت اكسبلورر

وليس متصفح اخر


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


حتى لو جينا نرفعها على موقعنا تشتغل تمام





وبالمثل سوى الفوتر




الى هنا ينتهى الدرس


المطلوب من الاعضاء:


تصميم اى هيدر ووضعه المثال صورة..........





التوقيع :
عالم مطورى الويب لتعليم برمجة وتصميم المواقع
www.advphp.com

----------------
اول برمجياتى,اسكربت AraDown العملاق لاشهار المواقع وزيادة دخلك من ادسنس

http://aradown.info
قديم 17-08-2009, 04:13 PM   رقم المشاركة : [2]
مطور نشيط
الرتبةالرتبة
الصورة الرمزية dj01tech
 

dj01tech يستحق التميز

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


dj01tech غير متواجد حالياً  
موضوع مغلق

العلامات المرجعية

مواضيع جديدة في قسم دورة تصميم المجلات الإلكترونية

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

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

BB code متاحة
كود [IMG] متاحة
كود HTML معطلة
Trackbacks are متاحة
Pingbacks are متاحة
Refbacks are متاحة

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

المواضيع المتشابهه
الموضوع كاتب الموضوع المنتدى مشاركات آخر مشاركة
مشكلة في الهيدر والفوتر ونقاط تمددهم photoshop girl دعم فني ، و صيانة المنتديات مجاناً 5 19-11-2010 03:08 PM
[ عمل صفحة موقع شخصي بسيطة ~ الجزء الأول { الهيدر والفوتر } ] star wolf دروس تصميم و شروحات مصورة 0 05-11-2010 05:40 AM
برنامج Simpo PDF to Word لتحويل الكتب الالكترونية الى ملف وورد والتعديل عليه aramnet قسم البرامج العامة المشروحة 0 05-10-2010 10:46 PM
الدرس الثانى: درس تصميم الهيدر والفوتر وتقطيعـــه vista-design دورة تصميم ستايلات منتديات الفي بي vBulletin 0 14-07-2008 03:45 PM




Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2012, Jelsoft Enterprises Ltd.
Search Engine Friendly URLs by vBSEO 3.5.2
new notificatio by 9adq_ala7sas
الحقوق محفوظة لكل المطورين والمواقع العربية

Security team


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

جميع الأوقات بتوقيت GMT +3. الساعة الآن 08:28 AM.