ملف كامل - العلامة الشرطية في منصة بلوجر

العلامة الشرطية Conditional Tags في منصة بلوجر  غنية عن التعريف نظرا لتطرق الكثير من المدونين لها سواء بشكل سطحي او بالمستوى الإحترافي وما ذلك إلا لأهميتها ...وكمدون أو مطور أو حتى محترف ، أنت تحتاج إلى معرفة المزيد حول هذه الميزة التي يعتني بها جدا فريق خبراء منصة البلوجر.
ولمن لا يعرف دور هذا الكود فبإستخدامه  في ملفات القوالب الخاصة بك يمكّنك من تغيير عرض المحتوى وفقا للظروف التي تطابقها الصفحة الحالية  كالتحكم في جزء من القالب الخاص بك في مكان معين تحت شرط معين. على سبيل المثال: باستخدام العلامات المشروطة، يمكنك إخفاء / عرض محتوى على صفحة / صفحة / تصنيف / شريط جانبي محدد، إلخ.
في هذا البرنامج التعليمي، سوف نتشارك معا ضروف العلامات الشرطية وكيفية استخدامها بشكل صحيح في النموذج الخاص بك.

فهم عام للعلامة الشرطية

من جديد ... ببساطة هاته العلامات تتيح لك التحكم في إظهار أوإخفاء المحتوى بصفة عامة (أداة أو سكريبت أو حتى حقل كامل مثل القائمة الجانبيةsidebar-wrapper أو تذييل القالب footer ) في صفحات محددة أو تصنيف معين لنأخذ مثال عن شكل الكود

<b:if cond= >

</b:if>

ملاحظة:

بدايتا نجد الوسم if وهو خاص بالشرط لكن هنا في بلوجر نجده مستفرد بحرف b وهي إشارة لكلمة Blogger وبالتالي فهو خاص ببلوجر فيكون بهذا الشكل <b:if> ثم نغلق العلامة بهذا الشكل </b:if> ثم نجد cond= والتي تعني الشرط أو الشروط condi إلى هنا أصبح الكود واضح وسيتكرر بنفس التنسيق والترتيب في كل مرة نحتاج إضافته في القالب الفرق الوحيد في تغير إشارة توجيه الشرط أو بعبارة منطق (ماذا نريد من هذا الشرط أن يفعل؟ ) لاحظ الكود التالي حتى نفهم

<b:if cond='data:blog.url == data:blog.homepageUrl'>
...
</b:if>

ملاحظة:

ما أضفناه للشرط هو عرض الصفحة الرئيسية وهذا معناه أن أي شي أضعه في مكان النقاط ... ستقوم العلامة الشرطية بإظهاره فقط في الصفحة الرئيسية ويخفيه عن جميع الصفحات الأخرى ولتطبيق العكس أي إخفائه فقط في الصفحة الرئيسية سأستبدل الرمز == بـالرمز != لنجرب مثال عملي :) على أداة

تطبيق عملي

نقوم اولا بإختيار الأداة مثلا أداة التسميات Label ونضيف العلامة الشرطية

<b:widget id='Label1' locked='false' title='التسميات' type='Label'>
  <b:widget-settings>...</b:widget-settings>
   <b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
يبقى كود الأداة هنا في وسط العلامة الشرطية 
</b:if>
  </b:includable>
</b:widget>

ملاحظة:

أسفل الوسم<b:includable id='main'> (الذي ستجده مكرر في جميع الأدوات المقدمة من منصة بلوجر) لاحظ أننا قمنا بوضع العلامة الشرطية الخاصة بنا ثم قمنا بإغلاق العلامة فوق نهاية الوسم تماما.

الآن لو نقوم بحفظ التعديل ستجد أداة التسميات Label ظاهرة على الصفحة الرئيسية ومخفية عن بقية الصفحات وكما قلت سابقا لتطبيق العكس إستبدل الرمز== بـالرمز !=
كما أنك تستطيع التحكم في أي شي آخر ماعدى الأدوات مثلا نمط style.css لشكل صفحة معينة أو عنوان أو إخفاء المحتوى وإليك مثال عملي كيف يتم ذلك بإستعمال نفس العلامة الشرطية

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style> 
#sidebar-wrapper {display:none;}
</style>
</b:if>

ما قمنا به أننا أخفينا القائمة الجانبية sidebar-wrapper من على الصفحة الرئيسية فقط وذلك بإستعمال خاصية display:none; وإليك مثال آخر :o

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style> 
.post-body {
    font-size: 20px;
    background-color: black;
}
</style>
</b:if>

ماقمنا به هو أننا أضفنا نمط style.css لشكل صفحات التدوينة إلى العلامة الشرطية مما يجعل شكلها على الصفحة الرئيسية مختلف عن باقي الصفحات لاحظ حجم الخط font-size: 20px; أي كبير نوعا ما ولون الصفحة background-color: black; جعلناه أسود

ملاحظة:

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

أنواع العلامة الشرطية

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

الصفحة	النوع	كود العلامة الشرطية	المعلومات الأساسية
الصفحة الرئيسية	URL	<b:if cond='data:blog.url == data:blog.homepageUrl'>...</b:if>	عرض المحتوى فقط على عنوان الصفحة الرئيسية للمدونة
صفحات التدوينات	pageType	<b:if cond='data:blog.pageType == "item"'>...</b:if>	عرض المحتوى على صفحة التدوينات فقط
صفحات ثابتة	pageType	<b:if cond='data:blog.pageType == "static_page"'>...</b:if>	عرض المحتوى على الصفحات الثابتة فقط
صفحات التدوين و الثابتة	URL	<b:if cond='data:blog.url == data:post.url'>	عرض المحتوى في كل من صفحات التدوين و الصفحات الثابتة فقط
صفحات الأرشيف	pageType	<b:if cond='data:blog.pageType == "archive"'>...</b:if>	عرض المحتوى على صفحات الأرشيف (تعمل العلامة فقط في حالة إضافة أداة الأرشيف)
صفحات القوائم	pageType	<b:if cond='data:blog.pageType == "index"'>...</b:if>	عرض المحتوى على صفحات الإنتقال بين التدوينات و صفحات عرض مواضيع التسميات وكذلك الصفحة الرئيسية
تدوينة محددة بـ ID	ID	<b:if cond='data:blog.postId == "111111"'>...</b:if>	عرض المحتوى فقط على التدوينة بعنوان ID الخاص بها نضع ID التدوينة في المكان 111111) للحصول على ID التدوينة نجده داخل مكان التعديل على الموضوع فوق في الرابط أمام postID=
صفحات محددة بـ ID	ID	<b:if cond='data:blog.pageId == "222222"'>...</b:if>	عرض المحتوى فقط على الصفحة الثابتة بعنوان ID الخاص بها نضع ID التدوينة في المكان 222222) للحصول على ID التدوينة أو الصفحة نجده داخل مكان التعديل على الصفحة فوق في الرابط أمام pageID=
صفحات محددة برابط	URL	<b:if cond='data:blog.url == "URL+"'>...</b:if>	عرض المحتوى فقط على عنوان رابط URL محدد للتدوينة أو الصفحة (نضع رابط الموضوع كامل و ليس النسبي في المكان URL+)
صفحات محددة بالإسم	URL	<b:if cond='data:blog.pageName == "Name+"'>	عرض المحتوى فقط على إسم العنوان المحدد للتدوينة (نضع إسم التدوينة تماما في المكان Name+)
صفحات التسميات	search	<b:if cond='data:blog.searchLabel'>...</b:if>	عرض المحتوى في صفحات التسمية (يظهر المحتوى عندما نضغط على التسمية مثلا قوالب )
صفحة التسمية الواحدة	search	<b:if cond='data:blog.searchLabel == "Label+"'>...</b:if>	عرض المحتوى في صفحة التسمية الواحدة (يظهر المحتوى عندما نضغط على التسمية المطلوبة مثلا قوالب ولكن لايظهر عندما نضغط إضافات نضع إسم التسمية في المكانLabel+)
صفحة البحث	search	<b:if cond='data:blog.searchQuery'>...</b:if>	عرض المحتوى في صفحات البحث ( يظهر المحتوى عندما نبحث على موضوع )
صفحة طلب بحث معين	search	<b:if cond='data:blog.searchQuery == "Word+"'>...</b:if>	عرض المحتوى في صفحة البحث عن كلمة واحدة محددة نقوم بوضعها في العلامة الشرطية مكان Word+
صفحة الخطأ	pageType	<b:if cond='data:blog.pageType == "error_page"'>...</b:if>	عرض المحتوى في صفحة الخطأ 404 ( يظهر المحتوى عندما نواجه رابط معطل )
واجهه الجوال	mobile	<b:if cond='data:mobile'>	عرض المحتوى في واجهة الشاشات الذكية ( لابد أن لانغفل تجاوب المحتوى مع شاشات العرض الذكية )

ملاحظة:

فقط للعلم ... ستلاحظ بعد مدة من وضع كودالعلامة الشرطية في القالب يتم إستبدال علامات التنصيص والإقتباس "إلى رمز&quot; وهذا في الواقع، سيتم تلقائيا من قبل بلوجر لجعلها سهلة القراءة. وهذا شكل العلامة بعد تحولها <b:if cond='data:blog.pageType == &quot;item&quot;'>

علامة شرطية أخرى تضم صفحتين من نفس النوع pageType و URL

الصفحة	النوع	العلامة الشرطية	المعلومات الأساسية
التدوينات والصفحات	pageType	<b:if cond='data:blog.pageType in {"item","static_page"}'>	عرض المحتوى على صفحة التدوينات والصفحات الثابتة فقط
صفحتين برابط	URL	<b:if cond='data:blog.url in {"url+","url+"}'>	عرض المحتوى على صفحتين برابط (نضع الروابط كاملة مكان URL+)

بدائل لرموز الشرط

هنا علامة الإظهار وعدم الإظهار تختلف فبدل الرمز == نجد الكلمة in وبدل الرمز != نضع الكلمة not in خلاصة القول إذا أردنا إظهار المحتوى نضعinولإخفائه نضع not in تماما مثل العلامات الشرطية التي مرت معنا.

== --► true  (صحيح/ظاهر)
!= --► false (خاطأ/مخفي)
in --► true (صحيح/ظاهر)
not in --► false (خاطأ/مخفي)

تحذير:

لاتقم بإستعمال data:blog.canonical هذه العلامة الشرطية لم تعد تعمل مثال:

<b:if cond='data:blog.url == [data:blog.canonicalHomepageUrl] + "Url"'> 
<!-- [data:blog.canonical] no longer works on the template html page  -->
</b:if>

علامة البديل العكسي <b:else/>

يتم وضع <b:else/> غالبا داخل وسم العلامة الشرطية == وذلك لعكس الشرط حيث نتجنب التكرار ونربح التحكم والتنسيق بدل ان نكتب شرطا اخر، مثلا لو لم يتحقق الشرط الاول حقق الشرط الثاني مثال بسيط على ذلك :

<b:if cond='data:blog.url == data:blog.homepageUrl'> 
    [...المحتوى الأول...] 
    <b:else /> 
    [...المحتوى الثاني...] 
</b:if>

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

<a expr:href='data:post.url'>
  <b:if cond='data:post.thumbnailUrl'>
   <img expr:alt='data:post.title' expr:src='data:post.firstImageUrl'/>
       <b:else/>
  <b:if cond='data:post.firstImageUrl'>
  <img expr:alt='data:post.title' expr:src='data:post.thumbnailUrl'/>
       <b:else/>
  <img expr:alt='data:post.title' expr:title='data:post.title' src='s1600/no-image-thumb-png'/>
    </b:if>
    </b:if>
</a>

هذا الكود ستجد نفسه تقريبا في كل قالب مدونة وهو المسؤول عن إظهار صور التدوينة...ركز معي :)  سيبدأ المتصفح بقراءة الكود كما هو ملون بهذا الشكل (وتذكر أن <b:else/> تعني البديل للمحتوى وكما تلاحظ هي داخل العلامات الشرطية الخاصة بالصور)

مراحل المراجعة

• إستدعاء أول صورة في التدوينة (لاتوجد صورة) تخطي <b:else/>
• إستدعاء أية صورة في التدوينة (لاتوجد أية صورة) تخطي <b:else/>
• إستدعاء صورة /s1600/no-image-thumb.png (موجودة) وإذا لم توجد سيعرض رابط التدوينة في حقل الصورة