اضافة جملة "إقرا المزيد"لاختصار مواضيعك في الصفحة الرئيسية

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

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

الطريقة:

(الجزء الاول)

يجب ان تأخذ نسخة احتياطية من قابلك قبل البدء في العمل.

اذهب الي Layout>Edit HTML في مدونتك و تأكد من قد ضغط علي "expand widget templates"
ثم ابحث عن </head> في القالب (اضغط CTRL+F للبحث في المتصفح)...
واضف قبلها مباشرة الكود الاتي

<script language='javascript' src='http://halotemplates.s3.amazonaws.com/jquery-truncator/jquery-1.2.3.pack.js' type='text/javascript'/>
<script language='javascript' src='http://halotemplates.s3.amazonaws.com/jquery-truncator/jquery.expander.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {

$('.excerpt').expander({
slicePoint: 280, // default is 100
expandText: 'إقرأ المزيد', // default is 'read more...'
});

});
</script>

ثم ابحث عن <data:post.body/>

ثم حدد الكود الاتي

<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

و استبدله بهذا الكود ...

<b:if cond='data:blog.pageType != "item"'>
<div class='excerpt post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
<b:else/>
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
</b:if>

الان اضغط Preview للتأكد من خطواتك سليمة و سوف تري ان مواضيعك قد لخصت و اضيفت كلمة "إقرأ المزيد" بجانب كل موضوع و للحفظ اضغط Save.
و بكدة يكون الجزء الاول انتهي ولو ضغط علي " إقرا المزيد" الموضوع هيتمدد في نفس الصفحة...
لكن لو انت عايز يتفتح لوحده في صفحة اذن اقرأ الجزء الثاني.

(الجزء الثاني)

1- ابحث عن هذه الكلمة expander.js واستبدلها بهذه extractor.js
2- ابحث عن الكود الذي اضفناه عند <data:post.body/> و اضف اليه الجزء الملون بالاحمر

<b:if cond='data:blog.pageType != "item"'>
<div class='excerpt post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
<a expr:href="data:post.url">إقرا المزيد</a>
<b:else/>
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
</b:if>

تأكد من اضافة هذا السطر في مكانه الصحيح فوق <b:else/> مباشرة والا قد تحدث اخطاء.
الان اضغط Preview ولو حصل اخطاء مش هينفع تشوف اللبوج و يظهرلك كلام بالاحمر.... اما لو صح في حتشوف البلوج و تحت المواضيع كلمة "اقرا المزيد".
الان اضغط Save.

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