علامات الأدوات لأداة Layouts

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

أنواع العلامات

يصف هذا القسم تنسيق HTML الذي يمكنك استخدامه داخل علامات الإغلاق.

أوامر التضمين (b:include)

متى أستخدم أوامر التضمين

تحصل الاستفادة القصوى من أوامر التضمين إذا كان لديك قسم من الكود تريد إعادة استخدامه في عدة أماكن مختلفة، أو تضمينه في ظروف معينة فقط.
للقيام بذلك، اكتب المحتوى داخل b:includable، ثم استخدم b:include حيثما تريده أن يظهر.

التنسيق

  [أدرج أي محتوى تريده هنا]

السمات

• id (مطلوب): معرّف فريد يتكون من حروف وأرقام. يجب أن تحتوي كل أداة على معرّف قابل للتضمين بـ id='main'.
• var (اختياري) معرّف يتكون من حروف وأرقام، للإشارة إلى البيانات داخل هذا القسم.

إذا أنشأت المزيد من العناصر القابلة للتضمين بمعرّفات مختلفة، فلن تظهر تلقائيًا. ولكن إذا أنشأت عنصر قابل للتضمين باستخدام id='new'، يمكنك الإشارة إليه في العنصر الرئيسي القابل للتضمين بـ وسيظهر بذلك الشكل.
في ما يلي السمات لعلامة b:include:

• name (مطلوب): معرّف يتكون من حروف وأرقام. يجب أن يطابق معرّف علامة b:includable حالية في نفس الأداة.
• data (اختياري): تعبير أو إحدى البيانات لتمريرها إلى القسم القابل للتضمين. وسيصبح هذا هو قيمة السمة var في العنصر القابل للتضمين.
• cond (اختياري) تعبير يمنع تنفيذ أمر التضمين إلا إذا كانت النتيجة true. ويتطابق ذلك تمامًا مع سمة cond في b:if.

مثال

إليك مثال يوضح كيفية استخدام b:includable وb:include.
أهم شيء هو أن تعرف كيف يتضمن القسم "الرئيسي" قسم "المشاركة" داخله. إنه يمرر مشاركة تسمى "p" ويشير القسم المضمن إليه باعتباره "مشاركة" var الخاصة به، ثم يطبع العنوان.
تجدر الإشارة إلى أنه لا يتم تشغيل أمر التضمين إلا عندما يكون المؤشر أقل من 10، وبناءً على ذلك لن يتم عرض سوى 10 مشاركات بحد أقصى في هذا المثال (يبدأ المؤشر عند 0).

  
    
  


  Title: 

إخراج البيانات (:data)

أمثلة

• يطبع عنوان الأداة
  
• - Size: x  يطبع سمات عنصر صورة. قد تحتوي الصورة على مكونات مثل عنوان url والارتفاع والعرض. يشير استخدام علامة "." إلى أننا نريد عنوان URL لهذه الصورة، وليس عنوان URL لأي شيء آخر.
  

عرض المزيد من الأمثلة

راجع القائمة الكاملة بـ علامات تنسيقات البيانات المدعومة.

تكرار (b:loop)

متى أستخدم b:loop

تسمح لك العلامة loop بتكرار قسم من المحتوى عدة مرات. وعادة ما يستخدم هذا الأمر لطباعة كل مشاركة في قائمة بالمشاركات لصفحة معينة، أو كل تعليق، أو كل تسمية، إلخ.

التنسيق

التنسيق العام لاستخدام التكرار هو:

  [repeated content goes here]

يمكن أن يكون جزء "المعرّف" (i) أي اسم تختاره، ويُستخدم ليحل محل كل عنصر جديد في القائمة، في كل مرة خلال التكرار. علمًا بأن مجموعة البيانات، التي تحددها للقيم، يمكن أن تكون أي من البيانات الموصوفة في مقالة علامات البيانات كقائمة بالعناصر.
على سبيل المثال، في أداة مشاركات المدونات، تكون posts قائمة. وسيتكرر أي كود مثل الكود التالي خلال كل مشاركة، ليطبع العنوان لكل مشاركة، مع علامات الرأس حوله.

لاحظ كيف يتخذ "i" قيمة كل مشاركة بالترتيب، كي تتمكن من الحصول على العنوان من كل مشاركة.

النطاق العددي

تسمح لك علامة التكرار بالتكرار عبر نطاق عددي شامل، مثل "من 1 إلى 3" أو " من 3- إلى 9-"، حيث يأخذ المتغير قيمة العدد. سينشئ المثال التالي قائمة غير مرتبة من الأرقام 1 و2 و3.

 

سمة الفهرس

يكون لعلامات التكرار أيضا سمة فهرس اختيارية، والتي تقدم الفهرس الصفري للتكرار الحالي خلال التكرار الحلقي.

  
Index: , Number: 

سينشئ هذا المثال قائمة غير مرتبة من:

• الفهرس: 0، الرقم: 9
• الفهرس: 1، الرقم: 8
• الفهرس: 2، الرقم: 7

If وelseif وelse ‏(b:if)

متى أستخدم if أو elseif أو else

يمكنك استخدام العلامات b:if وb:elseif وb:else لعرض محتوى معين في بعض الحالات، ومحتوى آخر في حالات أخرى. على سبيل المثال، قد ترغب في إظهار نص معين على الصفحة الرئيسية فقط، ولكن تريد عرض نص مختلف عند عرض المشاركات الفردية.

التنسيق

  [المتحوى الذي سيتم عرضه إذا كان الشرط true]

  [المحتوى الذي سيتم عرضه إذا لم تكن أي من شروط if أو elseif السابقة true، وكان شرط elseif هذا true]

  [المحتوى الذي سيتم عرضه إذا لم يتحقق أي من شروط if أو elseif]

العلامتان b:elseif وb:else هي علامات اختيارية. بدونهما، ستكون النتيجة إما إدراج المحتوى في القسم b:if أو لا شيء. ولكن علامة الإغلاق
ستكون مطلوبة في كل حالة. بالنسبة إلى "الشرط" يمكنك وضع أي شيء يكون قيمته true أو false. بعض علامات البيانات تكون قيّم true/false من تلقاء نفسها، على سبيل المثال allowComments على مشاركة. أما بالنسبة إلى البيانات الأخرى، يمكنك مقارنتها مع قيّم محددة للحصول على true أو false. وإليك بعض الأمثلة:

• 
  True إذا تم تعيين المشاركة الحالية على إظهار الروابط الواردة.
• 
  True إذا كانت الصفحة الحالية هي صفحة عنصر (صفحة مشاركة).
• 
  True إذا كانت الصفحة الحالية هي صفحة عنصر (صفحة مشاركة) وتم تعيين المشاركة الحالية على إظهار الروابط الواردة.
• 
  True إذا لم يكن هذا هو اسم العرض لـ Fred.
• 
  True إذا كان Fred هو اسم العرض أو الصفحة الحالية هي صفحة ثابتة (وليست صفحة مشاركة).
• 
  True إذا كانت المشاركة الحالية بها أكثر من تعليق واحد.
• OR 
  True إذا كانت الصفحة الحالية هي مشاركة أو صفحة محددة.

التبديلات (b:switch)

متى أستخدم التبديل

يمكنك استخدام العلامة b:switch كما تستخدم العلامة b:if التي يصحبها العديد من علامات b:elseif. الميزة التي تحصل عليها من عملية التبديل الفرعية هي أنك لا تحتاج إلى تكرار اسم المتغير. يمكنك قراءتها بسهولة لمعرفة ما يحدد كل حالة على حدة، وما هي الحالة الافتراضية.

التنسيق



 [الإخراج إذا كان تقييم var يساوي Value 1]

 [الإخراج إذا كان تقييم var يساوي Value 2]
[… أي قيّم أخرى]

 [الإخراج إذا كان تقييم var لا يساوي أي علامة b:case موضحة]


مثال

يوضح هذا المثال كيفية إخراج رأس مختلفة، اعتمادًا على نوع الصفحة التي يتم عرضها.

  

Page

  

Post

  

Blog Posts

تعبيرات السمات (:expr)

متى أستخدم التعبيرات

يمكنك استخدام السمة expr لتعيين قيم السمة على أساس القيم في قاموس البيانات.

أمثلة

• Home
  رابط الصفحة الرئيسية مع عنوان url لصفحة المدونة الرئيسية.
• Posts RSS
  رابط به عنوان url لخلاصة RSS لمشاركة المدونة. يربط عامل التشغيل "+" السلسلتين بالتسلسل.

أمثلة

• min-height: px;
  إخراج ارتفاع نسبي محسوب، على أساس قيمة العرض الجديدة.
• 
  إخراج عنوان URL لتصنيف أول مشاركة.

أمثلة

بالنسبة إلى سمة نمط معقد يعتمد على متغيرات البيانات، يمكنك حسابها قبل بقية إخراج HTML، كي تتم قراءة HTML المتداخل بشكل أسهل.
var='style'
       value='”background-image: url(\”” + data:sourceUrl “\”); “
           + “ width: “ + data:width + “px; “ '>
 

 
   

expr:style=’data:style’

>
     

My Header

  



ملاحظة: لن يوجد المتغير إلا في العُقد الفرعية لعلامة b:with.

اطلع على هذا المثال

انقر لمشاهدة مثال عن كيفية استخدام كل من هذه العلامات في HTML لأداة PageList في مدونتك.

مثال

في هذه الأداة، يمكنك مشاهدة أمثلة لاستخدامات العلامات b:widget وb:includable (وb:include) وb:if (وb:else) وb:loop.

expr:id='data:widget.instanceId + "_select"'

> expr:value='data:link.href' selected='selected'> expr:value='data:link.href'>  ▼

• expr:href='data:link.href'

>

expr:href='data:link.href'

>