بداية لااابد منها ... الجزء الرابع والأخير

اكمالا لما بدأناه فى
الجزء الأول

الجزء الثانى

الجزء الثالث

هذا هو الجزء الاخير يتحدث بشئ من التفصيل عن جزء ( الجسم body ) لاى قالب , ولنتذكر ان وظيفة هذا الجزء هو ترتيب اجزاء المدونة ( الراس والجسم والاطر الجنبية والذيل ) الترتيب الصحيح , وتحديد مكان كل جزء منها بالنسبة للاجزاء الاخرى .

بنما كانت وظيفة جزء ( الرأس head ) هو تحديد شكل كل مافى المدونة , لونه وحجمه ولون الخلفيه و طوله وعرضه , الخ الخ الخ .

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

اضغط على الصورة لتراها بالحجم الطبيعى

الصورة الثانية بها توضيح لمنظر القالب = ( صندوق الأكواد ) الجزء الاعلى هو جزء ( الراس ) والجزء الاسفل هو جزء ( الجسم ) , لاحظ انه يوجد مطابقة فى الالوان بين الجزئين , وبين الصورة الثانية كلها والصورة الاولى بالاعلى .

ماعدا الكلام الموجود داخل المربعات بجزء الجسم , وهو

<b:section id="The Section id">
<b:widget id="The Widget id">
</b:widget>
</b:section>

هو ملون فقط للايضاح

اضغط على الصورة لتراها بحجمها الطبيعى

بعض الاختصارات

1- كلمة div اختصار لكلمة divition بمعنى انشاء قسم جديد يسمى كذا , واسم هذا القسم او العنوان هو الـ id وهو مميز لكل قسم .

2- كلمة section معناها " قسم " ايضا , لكن قسم فرعى داحل القسم الاكبر منه divition , ولكل section الـ id الخاص به ايضا .

3- كلمة class معناها الفئة , وبها ستجد اسم الجزء للتعريف به , مثله مثل الـ id مع بعض الاختلاف , دعك من هذا الاختلاف الان .

4- كلمة widget معناها القطعة التى توجد داخل كل section , هذه القطع هى التى نراها بالمدونة, مثل قطعة البروفايل وقطعة الارشيف وقطعة الساعه مثلا , الخ الخ الخ .
لكل قطعة id مميز لها حسب نوع القطعة , او الاداه التى اخترتها , فلو اخترت الاداه html/java script من صفحة الادوات ستنشأ قطعة جديده فى قالب المدونة لها id اسمه html , ومرقمة برقم معين لو كان هناك اكثر من اداه من نفس النوع , مثلا html1 , html2 , html3 وهكذا .
ولو اخترت اداه نصيه text ستنشأ قطعة جديده الـ id لها اسمه text1 و text2 و text3 وهكذا فى حالة وجود اكر من قطعة نصية .


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

كل قطعة تكون بهذا الشكل

<b:widget id='The Widget id' locked='false' title='Title of the widget' type='Type of the widget'/>

ولا تحتاج الى كود اغلاق فى الغالب

اما الـ section فلابد له من كود اغلاق بهذا الشكل

<section> < > < > </section>

وكذلك الـ div يحتاج الى اغلاق بهذا الشكل

<div> < > < > </div>

ترتيب اجزاء المدونة فى جزء ( الجسم ) يتبع نظام " التعشيش nesting " الذى تحدثنا عنه سابقا .

بمعنى : من الطبيعى ان الاطار الجانبى sidebar واقع داخل الـ body , لذلك يجب وضع اكواد الاطار الجانبى كلها من بدايتها <div id='sidebar'> وحتى نهايتها </div> داخل جزءالـ body , وليس قبله او بعده مثلا.

مثال اخر , ذيل المدونة هو اااخر شئ تجده فى المدونة بالاسفل , فمن الطبيعى ان تكون اكواد الذيل من اولها <div id='footer'> وحتى اخرها </div> واقعة بالجزء الاسفل من جزء الـ body وقبل نهايته مباشرة بكلمة </body> .

اتمنى ان تكون الصور بالاعلى مفيده وتغنى قليلا عن مزيد من التفاصيل . ده كان الجزء الاخير

اكتب ايميلك هنا