http://upload.dzbatna.net/upfiles/mi372123.png
,
,
,
http://upload.dzbatna.net/upfiles/mJD72695.png
اليوم يااخوان باذن الله راح نبدأ بالدرس مفصل الخامس والـ بيتم فيه شرح طريقة لـ النقاط الاساسية لتكملة الدورة وهي من الدروس المهمة
اولا , معرفة تحديد مسار الصورة بشكل سهل , بالاضافة الى تركي قالب templateي الهيدر header والفوتر
+ القوالب الـ بيتم تأطيرها مثل النافبار والفروم هوم ..
طيب اول شي كيف نقدر نحدد المسار الصحيح لاي استايل style ؟؟
المسار الصحيح للاستايل style بيبدأ من المجلد الـ بداخله الاستايل style .
ثانيا بيتم رفع الصور داخل مجلد vb المسمى عادة بهذا الاسم
1 / طريقة ازالة المسارات الزائده
كما بشرح طريقة الفيديو تبين انه بامكاننا عمل ذلك بالتحديد قبل اسم مجلد الصور الرئيسي مباشرة الى قبل هذه العلامة "
'"
كما بالشكل
http://upload.dzbatna.net/upfiles/Aq460505.png
وبعد ذلك نضغط من الكيبورد
Ctrl + h
ونجعل الـ
Replace with
فارغ , ونعم
Replace All
وبكذا نكون طبقنا الامر على كامل الاكواد
والان تبقى علينا رفع مجلد الصور الخاص بنا على احدى برامج الـ FTP
سيكون ايضا مسار رفع المجلد بهذه الطريقة
www / vb /
name file
نستبدل طبعا
name file باسم المجلد الخاص بالاستايل style
الان نجي لطريقة عمل استايل style جديد من داخل لوحة التحكم الخاصه بالمنتدى forum
1/ لوحة التحكم
, 2/ الاستايل styleات والقوالب
, 3/ التحكم بالاستايل styleات
, في اخر الصفحة نجد
4/ اضافة استايل style جديد نضغط عليه ونعمل اسم افتراضي لاسم الاستايل style ومن ثم 5/ حفظ .
الان نجي لطريقة تركيب install اكواد الهيدر headerوالفوتر
1 / لوحة التحكم ’ 2/ الاستايل styleات والقوالب
’ 3/ التحكم بالاستايل styleات
’ 4 نختار الاستايل style الـ تم عملة ف الخطوة السابقة .
وبعد ذلك نذهب من الخيارات الى القوالب الشائعة .
بعد ذلك سيآتي لنا ثلاث قوالب , الهيدر header
, الهيد انكلود
, الفوتر
بيتم التعديل فقط على قالب templateي الهيدر header
+ الفوتر
بالنسبة للهيدر سيتم مسح كامل ما بالقالب template باستثناء
3 اسطر الاخيره كما موضح
http://upload.dzbatna.net/upfiles/ZRh61344.png
||||||||||||||||| - يتم مسح هذه الاكواد
وسيتم وضع فقط كلاسات الهيدر header
رمز PHP:
<div id="header">
<div class="right">div>
<div class="left">div>
div>
كما موضح هنا
http://upload.dzbatna.net/upfiles/ubW61556.png
|||||||||||||||| - هذه كلاسات الهيدر header .
|||||||||||||||| - هذه كلاسات الفوتر .
الان نجي لتركيب install تعاريف css الـ تم عملها بالدرس مفصلي الثالث والرابع ..
ملاحظه : التعاريف كاملة لـ الهيدر header والفوتر , والتأطير الرباعي ..
يتم وضعها من خيارات css الرئيسي
http://upload.dzbatna.net/upfiles/4hM64097.png
الان تم تركيب install الهيدر header والفوتر وتعاريف كامل الهيدر header والفوتر والتاطير الرباعي
http://upload.dzbatna.net/upfiles/mJD72695.png
بعد الاطلاع على مثال لما عملناه نلاحظ يوجد حواف على الصور زائده لاتعطي شكلا جمالي
يتم ازالتها من خلال , css رئيسي
خلفية الصفحة
خيارات css الاضافيه وجعل قيم margin 0 0 0 0px
كما موضح ..
http://upload.dzbatna.net/upfiles/z4465395.png
وبكذا يكون قد ازلنا الحواف الزائده والمشوهة للشكل العام ..
http://upload.dzbatna.net/upfiles/mJD72695.png
الان نجي لطريقة تأطير قالب templateي النافبار + الفروم هوم
1 / النافبار ,, navbar
هذا هو قالب template النافبار
http://upload.dzbatna.net/upfiles/GEO65567.png
يتم تعديله من خلال , التحكم بالاستايل styleات البحث في القوالب
كما موضح
http://upload.dzbatna.net/upfiles/Y7i65931.png
بعد ذلك ستجد مسمى على اليمين بنفس الاسم الـ تم البحث عنه
اضغط عليه ومن ثم تعديل
وبالضغط من على الكيبورد
Ctrl + f
إبحث عن الجملة joomla التالية
رمز PHP:
وضع فوقها مباشرة الكلاسات العلوية الخاصة بالتأطير
http://upload.dzbatna.net/upfiles/3nA66214.png
وبعد ذلك قم بالبحث عن
وضع تحتها مباشرة الكلاسات السفلية الخاصة بالتاطير
http://upload.dzbatna.net/upfiles/yyX66550.png
بكذا انتهينا من تأطير النافبار تأطير رباعي ..
http://upload.dzbatna.net/upfiles/mJD72695.png
2 / الفروم هوم ,, forumhome
هذا القالب template يتضمن اقسام المنتدى forum بالاضافة الى الاحصائيات اسفل المنتدى forum
نبحث بنفس الطريقة السابقة على القالب template , وبعد ذلك
نقوم بالبحث داخل القالب template
على
ونضع فوقها مباشرة الكلاسات العلوية
ونبحث على
ونضع اسفلها مباشرة الكلاسات السفلية
بكذا اطرنا الاقسام
نجي لطريقة تأطير الاحصائيات
نبحث بنفس القالب template على
ونضع فوقها مباشرة الاكواد العلوية
ونبحث ايضا على
ونضع تحت
الاكواد السفلية
كما موضح ..
http://upload.dzbatna.net/upfiles/ogJ67594.png
بكذا تم تأطير الاحصائيات
http://upload.dzbatna.net/upfiles/mJD72695.png
نظرة سريعة لما قمنا بعمله
http://www.dzbatna.com/attachments/6...412570t-13.png
http://upload.dzbatna.net/upfiles/mJD72695.png
ملاحظة : رجائي الرجوع الى الفيديو لتثبيت setup واتضاح بعض المعلومات
http://upload.dzbatna.net/upfiles/mJD72695.png
,
,
- اليوتيوب ~ youtube .................................................. ..هنا
- فور شيرد ~ 4shared ..................................................هنا
وفي الختام نسأل من الله العلي القدير ان نكون قد وفقنا في توصيل المعلومة على اكمل وجه , وعلى لقاء ان شاء الله في الدرس مفصل القادم ,, والـ بيتم شرح طريقة فيه طريقة تركيب install تأطير اكثر القوالب شيوعا .
http://upload.dzbatna.net/upfiles/Qil76159.png