شرح اضافة خاصية اقرا المزيد لمدونات بلوجر

بسم الله الرحمن الرحيم .
هل تريد تلخيص تدويناتك في الصفحة الرئيسية؟
هل تريد اضافة زر " إقرأ المزيد " ؟
هل تريد سهولة تصفح موضوعات مدونتك ؟
اذاً فالحل معنا !
الاداه من الادوات المستخدمة حديثا والتى تساعد على إظهار مدونتك بشكل انيق وجميل ويُسَهل على الزوار تصفخ مدونتك عن طريق تلخيص التدوينات .

اول خطوة ادخل الى لوحة تحكم بلوجر

اذا كنت من مستخدمى الواجهة القديمة اضغط على تصميم >> تحرير HTML
اذا كنت من مستخدمى الواجهة الحديثة اذهب الى "قالب">> تحرير HTML
تتبع الخطوات التالية :-

قم بحفظ نسخة احتياطية من القالب لأستعادتها في حالة الطوارئ

قم بـ"توسيع قوالب عناصر واجهة المستخدم"

ثم ابحث عن الكود التالى :

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

ستجده على هذا الشكل :

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>

قم بتحديده ولصق هذا الكود مكانه :

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'>إقرأ المزيد<data:post/></a>
</div>
</b:if>

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

ملاحظة هامة : يجب الضغط على " ادراج رابط انتقال " وهو زر يوجد في اعلى صفحة كتابة الموضوع وتكون بهذا الشكل :

اضغط عليه في نهاية النص الذى تود اظهاره في الصفحة الرئيسية ( نهاية الملخص )

كيفية اضافة صورة بدلا من جملة "إقرأ المزيد "
اتبع الشرح التالى :-

ابحث عن هذا الكود :

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>

وضع هذا الكود بدلا منه :

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><img alt='إقرأ المزيد' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUS__B04dvNQk7QmrXa8W3Q6Ubt6-SqckL7BPh4dNwfCv1SByhpp_AkExVTETlBHZnkA6b6jPUxS-2LUv76hXS0fZ-BTZoJ4L55BUZmtWfgvwCXMX9xRgE4Yj-CPUI9lw9-WdNNGBz3Zgf/s1600/redmore2.png'/></a>
</div>
</b:if>

يمكنك تغيير رابط الصورة المحدد باللون الاحمر ووضع اى صورة تناسبك وهذه بعض الصور لتختار منها :-