دورات شروحات قوالب بلوجر دورة تصميم قالب بلوجر من الصفر 2019 ( الجزء الثاني)

 n Farg

تم النشر في

أغسطس 01, 2019

وقت القراءة

4 دقيقه للقراءة

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

تم شرح العلامة الأساسية <b: widget /> في الجزء الأول دورة تصميم قالب بلوجر من الصفر. في هذا المنشور ، سيكون هناك وصف تفصيلي لكيفية استخدام علامة عناصر الأدوات  الدقيق في ما يظهر داخل عنصر الأدوات.

نظرًا لأننا نريد أن نتعلم ونجعل ونصمم قالب بلوجرإحترافي ، فيجب علينا العمل على قالب HTML ، قمت بتصميم قالب متجاوب بإستخدام بوتستراب و يحتوي علىHeader, Navbar, Main, Sidebar, Footer . وما إلى ذلك. لا تتوفر هذه الميزات في قالب HTML الحالي الخاص بنا حيث نعمل.

لا تحتاج إلى تنزيل Bootstrap. إليك قالب Bootstrap  فارغ جاهز وهاذا القالب سنعمل عليه في الدروس القادمه.

انتقل إلى لوحة تحكم بلوجر المظهر تحرير HTML وقم بحذف القالب الحالي واضف قالب البوتستراب التالي.

قالب البوتستراب لبلوجر

قواعد إنشاء قسم في بلوجر

• 1. كل قسم له وسم فتح ووسم إغلاق. وسم الفتح <b:section> ووسم الأغلاق </b:section> قم بإنشاء موضوع وقم بفحص المدونة بأداة inspect element من المتصفح  ، سترى فئة "div "class  بدلاً من القسم "section". ولكن في محرر HTML في بلوجر ، لا يتم تغيير الأقسام إلى فئة div.
• 2. يجب أن يكون لكل قسم معرفة "id" وفئة "class" فريد. تسمية فئة اومعرفة في  قسم آخر ممنوع أي انك لن تستطيع تسمية قسمين بنفس الأسم. نظرًا لأن القسم يتم تحويله إلى div ، تبقى الفئة ومعرف القسم في div كسمات. حتى نتمكن من تخصيص تصميم القسم حسب هذه الفئة والمعرف.
• 3. لا يسمح لك أن تداخل قسم.بداخل قسم  آخر هذا غير صالح.
• 4. يمكنك إدراج سمات معينة فقط.
• 5. سيكون من الأفضل إنشاء قسم تحت div.

السمات	القيمة	مطلوب/إختياري	الأشارة إلى
id	اسم فريد. يسمح فقط بالحروف والأرقام. مثال: header, navbar, sidebar, footer  إلخ.	مطلوب	تحديد وتخصيص القسم مع id.
class	مثل  id.	اختياري	تحديد وتخصيص القسم مع class.
maxwidgets	أرقام. مثل: 1 ، 2 ، 3 ، 10 إلخ.	اختياري	عدد الأدوات  التي نريدان نضعها  في هذا القسم.
showaddelement	قيم منطقية - "yes" / "no".	اختياري	إذا كانت "yes" ، فسيسمح القسم بإضافة الأدوات  ، إذا كانت "no"  لن تسمح فإضافة أي أداة.
growth	رأسي أو أفقي - "horizontal" / "vertical"	اختياري	إذا كان رأسيًا ، فسيتم ترتيب القسم جنبًا إلى جنب. مكدسة خلاف ذلك.

 قواعد إنشاء الأدوات

• يمكنك استخدام وسم البداية والنهاية كإعلان للأداة. علامة البدء هي <b:widget> وتكون علامة النهاية </b:widget>.
• يجب أن يكون لكل للأداة  معرف فريد وسمة type. تسمية فئة اومعرف لقسم آخر ممنوع. نظرًا لأنه يتم تحويل عنصر واجهة المستخدم إلى div ، تظل معرف الأداة م في div كسمات. حتى نتمكن من تخصيص تصميم القطعة من هذا المعرف.
• لا يسمح بتداخل الأدوات بداخل بعضهم البعض.
• يمكنك فقط إدراج السمات المحددة 
• يجب أن تضطر إلى إنشاء أداة  بداخل قسم أذا ارادت إنشاء أداة جديده.
• غير مسموح لك بإدراج HTML في الأدوات

سمات علامة الأداة

السمات	القيمة	مطلوب / اختياري	الأشارة إلي
id	اسم فريد. يسمح فقط بالحروف والأرقام. مثال: header, navbar, sidebar, footer etc.	مطلوب	تحديد وتخصيص القسم مع معرف.
type	Header, Blog, Profile, PageList, AdSense, Attribution, HTML	مطلوب	تحديد نوع الأداة.
locked	yes, no	إختياري	إذا كانت "yes" ، فلا يمكنك حذف هذه الأداة أو نقلها.
title	ضع أي اسم. مثال: أدوات ، إعلان ، قوائم إلخ	إختياري	عرض عنوان هذه الأداة.
pageType	كل من , archive, main, item, static, all	إختياري	تحديد نوع صفحة الأداة.
mobile	yes, إفتراضي  no	إختياري	إذا كانت "yes" ، فسيتم عرض الأداة على الجهاز المحمول.

الاختلافات بين الأقسم و الأدوات في بلوجر

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

أوجه التشابه بين القسم و الأداة في بلوجر

القسم	الأداة
القسم لا يمكن أن يحتوي علي قسم أخر.	الاداة أيضا لا يمكن أن تحتوي علي اداة أخري.
عند فحص القالب بأداة inspect element ستجد انه تم تغير وسم القسب بالوسم div.	الأداة أيضا يتم إستبدالها بالوسم div.
كل قسم لديه معرف فريد.	كل اداة لديها معرف فريد
ليس للقسم أي سمة للتحكم في العرض أو الاخفاء على الأجهزة المحمولة.	يحتوي عنصر واجهة المستخدم على سمة للتحكم في العرض أو الاخفاء على الأجهزة المحمولة.
لا يحتوي القسم على السمة title لعرض أو إخفاء أي عنوان.	تحتوي الأداة  على السمة title لعرض أو إخفاء اسم العنوان.
القسم يسمح بإضافة HTML بداخلها مباشرة.	الأداة لا تسمح بإضافة HTML بداخلها مباشرة.

مزايا تسمية فئة القسم:

1. على الرغم من أنه من الاختياري تسمية فئة القسم ، إلا أننا يجب أن نضيفها لأن التسمية ستساعد بلوجر على تحديد كيفية نقل محتوى القالب عند تغيير القالب .

2. الاسم الأساسي للفئات "class"هو‘navbar’ for navigation menu, ‘header’ for header section, ‘main’ 

إلي الأن ينتهي هذا الجزء من سلسلة أنشاء قالب بلوجر من الصفر يتبع في الجزء القادم حيث سنبدأ فعلياً بأنشاء أو قالب بلوجر إحترافي ومتجاوب لنا.

نراكم في الجزء التالي