كيفية تنسيق عنوان مشاركات بلوجر

*****

منذ فترة طويلة وأنا أبحث عن كيفية تنسيق عنوان المشاركات في مدونة بلوجر وأخيرا وفقني الله في الوصول إلى الحل والذي سيتم شرحه في محورين : الأول هو تنسيق عنوان المشاركة في القسم التابعة له المشاركة ، أما الثاني فيتناول تنسيق عنوان المشاركة كوحدة مستقلة عن القسم التابعة له وذلك كالاّتي :

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

قد يحتوي بعض الأقسام (التسميات) في مدونة بلوجر على أكثر من مشاركة ، وحتى يمكن تنسيق عناوين المشاركات وهي في الأقسام التابعة لها وذلك في كل المدونة نتبع الخطوات التالية :

1- أدخل إلى لوحة تحكم بلوجر ثم خذ نسخة إحتياطية من القالب تحسبا لحدوث أخطاء ثم إختار قالب ( المظهر) من القائمة الجانبية ثم إضغط على html تحرير وذلك للدخول إلى القالب .

2- ثم إضغط عند نهاية أول سطر من أكواد القالب لإظهار مؤشر الفأرة ثم إضغط ctrl+ f من لوحة المفاتيح حتى يظهر مربع البحث في أعلى يمين القالب .

3- ألصق الكود التالي في مربع البحث السابق الذكر ثم إضغط inter من لوحة المفاتيح.

<a expr:href=’data:post.url’><data:post.title/></a>

4- أنظر في أكواد القالب سوف تجد أن مؤشر الفأرة يقف عند كود مثل الكود السابق الذي وضعته في مربع البحث لكنه مظلل باللون الأصفر .

ويمكن إيجاد الكود أيضا بسهولة وذلك تحت الديف الاّتي الخاص بالمشاركات :

<div id=’posts’>

ثم قم بتوسيع الكود التالي الموجود تحت ديف المشاركات السابق :

<b:includable id=’post’ var=’post’>

حيث ستجد الكود المستهدف تحته مع مجموعة من الأكواد بين وسمي البداية والنهاية له .

5- أضف الكود <h2></h2> وهو الكود الخاص بعنوان المشاركات إلى الكود السابق كالاّتي :

 <a expr:href='data:post.url'><h2><data:post.title/></h2></a>

6- إحفظ القالب ثم قم بتنسيق العنصر h2 في الجزء الخاص بتنسيق القالب أي مع أكواد CSS كما سيأتي في ثالثا .

ثانيا: طريقة أخرى لتنسيق عناوين المشاركات داخل الأقسام

على الرغم من أن الطريقة السابقة تحقق الهدف وهو تنسيق عناوين المشاركات وهي في الأقسام التابعة لها إلا أنه عند فحص الموقع بإستخدام الموقع الشهيرW3C تظهر هذه الطريقة كخطأ في هذا الموقع لذلك تم إستخدام طريقة أخرى وهي حذف الكود <h2> والكود </h2> من الكود التالي :

<a expr:href='data:post.url'><h2><data:post.title/></h2></a>

وهو الكود الموجود في الطريقة السابقة ليصبح كالتالي :

<a expr:href='data:post.url'><data:post.title/></a>

ثم إعطاء معرف للعنصر a وليكن post-title ليصبح الكود السابق بعد إضافة المعرف إليه كالتالي :

<a id=’post-title’ expr:href='data:post.url'><data:post.title/></a>

ثم نقوم بتنسيق عناوين المشاركات بإستخدام هذا المعرف في المنطقة المخصصة للتنسيق كما سبق ذكره وذلك كالتالي :

#’post-title{ ثم نكتب هنا الخصائص المطلوبه كما سيأتي ذكره لاحقا }

ثالثا: تنسيق عناوين المشاركات خارج الأقسام

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

1- التأكد من وجود الكود التالي في قالب المدونة

<h2 class='post-title entry-title' itemprop='name'></h2>

أو وضعه عند عدم وجوده في منطقة المشاركات posts في القالب كما سبق توضيحه في أولا.

2- لمزيد من التوضيح فإن الكود في أولا والكود في ثانيا يكون مكانهما في القالب بين وسمي البداية <b:f> والنهاية <b:f/> بعد الكود :

<a expr:name='data:post.id'/>

وذلك كالاّتي :

<a expr:name='data:post.id'/>

    <!—بداية كود تنسيق عنوان المشاركة -->

<b:if cond='data:post.title'>

<h2 class='post-title entry-title' itemprop='name'>

<b:if cond='data:post.link'>

<a expr:href='data:post.link'><data:post.title/></a>

<b:else/>

<b:if cond='data:post.url'>

<b:if cond='data:blog.url != data:post.url'>

<!—بداية كود تنسيق عنوان المشاركة في القسم التابعة له -->

<a expr:href='data:post.url'><h2><data:post.title/></h2></a>

<!—نهاية كود تنسيق عنوان المشاركة في القسم التابعة له -->  

<b:else/>

<data:post.title/>

</b:if>

<b:else/>

<data:post.title/>

</b:if>

</b:if>

</h2>

</b:if>

<!—نهاية كود تنسيق عنوان المشاركة -->

<div class='post-header'>

3- ثم نقوم بتنسيق عنوان المشاركة سواء داخل القسم أو خارجه وذلك بوضع الأكواد التالية في الجزء الخاص بالتنسيق في القالب أي مع أكواد css كالاّتي :

.post h2{

text-align: center;

font-family: courier , tahoma , arial ;

font-size: 26px;

color: brown;

font-weight: bold;

direction: rtl;

margin: 5px 0 0 0;

padding: 5px 10px 5px 10px;

}

ملحوظة : يمكن تغيير الخواص المذكورة أعلاه سواء بالإضافة أو الحذف أو في قيمة كل منها بما يتناسب مع مدونتك .

ثم قم بحفظ القالب ثم إذهب إلى صفحات المدونة وأعمل إعادة تحميل للصفحة ولاحظ التغيير الذي يحدث في العنوان .

_________________

ودمتم في رعاية الله