شرح مكونات قالب مدونات البلوجر وخصائصه

بسم الله الرحمن الرحيم والصلاة والسلام على أشرف المرسلين سيدنا محمد النبي الأمين وعلى من سار الى هديه واستن بسنته الى يوم الدين أما بعد , السلام عليكم ورحمة الله وبركاته , كنت قد أعلنت سابقاً عن البدأ في افتتاح دروة لتعريب قوالب مدونات البلوجر , وبإذن الله اليوم سنبدأ ثاني دروسنا في دروة التعريب وسيكون عبارة عن شرح مكونات القالب وخصائصه , ولكي تتمكن من متابعة الدروة يتوجب عليك مشاهدة الدرس الأول من الدورة وكان بعنوان [ 1 ] شرح تنصيب الأدوات التي سنسخدمها في دروسنا مع بعض النصائح والتوجيهات

 يتكون أي قالب لمدونات البلوجر من الصورة التالية

- المكونات الاساسية لقوالب بلوجر :

1 -  الجسم الأساسى للقالب “ Body “

وهو عبارة عن الوعاء التى يحتوى بداخله كل المكونات الاخرى للقالب من الهيدر " Header "  والفوتر  " Footer " والغلاف الداخلى  " Content Wrapper " وغيرها أى انه اشبه بوعاء الطبخ الذى تقوم بإضافة كافة المقادير بداخله .

2 - الهيدر الخاص بالمدونة " Header "

وهو عبارة عن الجزء الموجود فى أعلى المدونة والذى يحتوى بدوره على عنوان المدونة " Title " ووصف المدونة    "Description " وايضا إعلانات منها " Adsense " وقد يحتوى على كل ما سبق ذكره او الجزء منه فهو المسئول عن تعريف المدونة وسيتم شرحه بالتفصيل لاحقا.

3 - شريط القوائم " Menu bare "

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

4 - الجسم الداخلى " Content Wrapper "

او المنطقة الخاصة بمحتوى المدونة او كما احب ان اسميه الغلاف الداخلى للمدونة

وهو يحتوى بداخله على كل من محتوى الرسائل " Main Wrapper " وأيضا محتوى السايدبار " Side bare  " وهو يعتبر الجزء الاهم فى المدونة وسيكون شغلنا الشاغل فى الفترة القادمة بما يحتويه من مكونات وتدوينات ومهارات.

5 - منطقة الرسائل " Main Wrapper "

يقع هذا الجزء فى الجسم الداخلى " Content Wrapper " والمسئول عن نشر المواضيع " Posts " وأيضا نشر التعليقات " Comments "  الخاصة بكل موضوع ومكونات اخرى سيتم وضعها فى هذا المكان ليظهر بشكل راقى وجميل.

6 - منطقة السايدبار " Sidebare "

يقع هذا الجزء فى الجسم الداخلى " Content Wrapper " وهو الجزء المخصص لوضع الادوات والاضافات الخاصة بك والتى تخص مدونتك من ( التسميات " Labels " , الأرشيف " Archives" ، التعليقات " Comments" ، اعلانات ادسنس " Adsense " ، أو اى موجوز تحت تضيفه " RSS " ) ويختلف هذا الجزء من قالب إلى أخر .

7 - الفوتر الخاص بالمدونة " Footer "

وهو عبارة عن الجزء الموجود فى أسفل المدونة وهو مثل السايدبار " Side bare  " تقريبا وهو مخصص لوضع الادوات والاضافات الخاصة بك والتى تخص مدونتك من ( التسميات " Labels " , الأرشيف " Archives" ، التعليقات " Comments" ، اعلانات ادسنس " Adsense " ، أو اى موجوز تحت تضيفه " RSS " ) ولكن له بعض المميزات الخاصة سيتم شرحها بالتفصيل لاحقا.

مثال لما سبق , صورة مدونة ملتقى الدروس

وإليكم بعض الأمور , أو بعض الخواص التي عادة ما نحتاج إلى تعديلها عندما نعرب قالبا .. وهي على النحو التالي :

 - text-align وتعني محاذاة النصوص , فإذا كان القالب إنجليزيا فستكون محاذاة النصوص على اليسار وستكون العبارة-إن صحت التسمية- هكذا ;text-align:left بينما لو كان القالب معربا ستكون هكذا ;text-align:right .

- float وتعني محاذاة التنسيق , وشأنها كشأن العبارة التي قبلها فعندما نريد عنصرا ما موجودا في المدونة أن يكون تنسيقه في اليمين تكون العبارة هكذا ;float:right بينما لو كنا نريد تنسيقه نحو اليسار هكذا ;float:left .

- padding وتعني الهوامش الداخلية فإذا كانت في القالب الإنجليزي موجودةً هكذا padding-left:3px; فإنه يلزمنا تغيير left إلى right لتصبح العبارة هكذا padding-right:3px; .

- margin وهي مضاد padding وتعني الهوامش الخارجية وهي لا تختلف عن padding , فإذا كانت في القالب الإنجليزي موجودةً هكذا margin -left:3px فإنه يلزمنا تغيير left إلى right لتصبح العبارة هكذا ;margin -right:3px .

- direction ونستطيع من خلالها تحديد اتجاه القالب كامل , بحيث نضيفها بهذا الشكل direction:rtl مثلا تحت Body هنالك سيتحول اتجاه القالب كاملا في بعض القوالب , وفي القوالب الأخرى سيبقى اتجاه بعض العناصر مثل ما هو مع بعض التغيير . وفي بعض القوالب تكون هكذا direction:ltr; فعلينا بتغييرها direction:rtl; .

توضيح : rtl تعني right-to-left أي من اليمين إلى اليسار , و ltr تعني rleft -to-rightمن اليسار إلى اليمين .

- Font-family , وتعني الخط , فإذا كان الخط هكذا ;font-family:arialونريد أن نغيره إلى خط آخر مثلا التاهوما سنغير arial فقط . ;font-family:tahoma .

هذا إيجاز لبعض الخواص [ css ] التي عادة ما أستخدمها عندما أعرب قالباً ما , ولن تفهموها بشكل جيد الآن , ولكن بعد التطبيق ستسهل لكم وستحبونها كثيرا .

أما بالنسبة لتعديل Html فإني لم أعد أستخدمها كثيرا عندما أعرب أحد القوالب , وذلك لأن أكثر التعديل يكون على css والتنسيق من خلالها من اليمين إلى اليسار , أو العكس .

فعادة ما نبحث في القالب في تحرير Html في البلوقر عن dir , ونضع بجانبها rtl لتكون بهذا الشكل dir="rtl" .

ملاحظة مهمة : الاتش تي ام ال تحتوي على السي اس اس , أي أنها تكون مع بعض , ولتتعرفو أكثر على الفروقات أنصحكم مرة أخرى بزيارة هذا الموقع http://ar.html.net

وانتظروا الدرس القادم , مع شرح تطبيق التعريب على قالب للبلوجر .

المصدر : مدونة ملتقى الدروس