منقوول من http://blog-arab.blogspot.com


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

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



الطريقة:

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


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

اذهب الي 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...'
**);

**);
</******>

ثم ابحث عن <dataost.body/>

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

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

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

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

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


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


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

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

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

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

المصدر http://blog-arab.blogspot.com/2008/1...post_9842.html

في الطرقة الأول

الكود التاني اللي المفروض نستبدله بالأولاني مش موجود عندي كدة
علما بأنني بستخدم تمبليت مش من بتوع بلوجر
المدونة أهي
http://alazifworld.blodspot.com

يعني الكود دة مش موجود عندي كدة خالص
اية الحل ؟؟

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

للأسف يا أخ محمد مش لاقي الحتة دي أصلا

<datapost.body/>

أنا بدور بـ Ctrl + f

انا حطيت لينك البلوج عشان تشوف التمبليت اللي موجود و لو حبيت احط فايل الاكس ام ال بتاعه عشان تشوف بنفسك دة أتصرف معاه ازاي

بجد يبقى جزاك الله خير لو حليتلي الموضوع دة
و جزاك خير طبعا من غير حاجة

للاسف في مشكلة في المنتدي في اظهار الاكواد....
و انا بعد اذن الاخ عبدو ححاطلك اللينك الاصلي للموضوع في المدونة و الموضوع فيها صحيح...
جربه و قلي وانا متابع معاك
http://blog-arab.blogspot.com/2008/1...post_9842.html

مانا تابعت من المدونة دي جزا صاحبها كل خير استفدت منه في كذا حاجة
لكن الحتة اللي بقولك عليها مش موجودة عندي اصلا

سوري المشاركة دي جت زيادة

مانا باقولك في مشكلة في ظهور الاكواد في المنتدي
و لما اكتبلك الكود بشكل صحيح بيطلع ناقص و عشان كدة انت مش لاقيه ...يعني لو انا كتبته كدة
<dataost.body/> حيظهر مكان النقتطين فوق بعض و حرف الp الوجه اللي انت شايفه دة.
فعشان كدة روح تابع الموضوع في المصدر عشان الاكواد متصلحة.
حط مكان الوجه دة .... نقطتين فوق بعض بعد data ...ثم بعدها حرف p

يا سيدي ايوة والله انا شغال من الموضوع الأصلي في المدونة

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

تمام تمام يا باشا نأسف للإزعاج

مش عارف لية ماكانتش بتظهر في البحث و ظهرت دلوقتي

ألف شكر يا معلم جزاك الله كل خير و آسف ع الازعاج مرة تانية

ولا يهمك يا باشا
وكمل بس الموضوع وقولي وصلت لايه وانا معاك..

تمام يا ريس اتحطت و اشتغلت و زي الفل
ألف شكر ليك و لصاحب المدونة اللي فيها الشرح
إن شاء الله لما أخلص البلوج لازم الف على كل الناس اللي افادوني دول اشكرهم

انا جربت الطريقه بس مش نفعت معايا

ببحث عن الكود <dataost.body/> بس مش بلاقيه وبالرغم اني بكتبه البطريقه الصحيحه وكمان جربته من المصدر الرئيسي وكمان جربت طريقة تانيه ومش لاقي الكود ده خالص

انا ضايف استايل تقريبا لاعب في الاكود

ياريت حد يفيدني

انا جربت الطريقه بس مش نفعت معايا

ببحث عن الكود <dataost.body/> بس مش بلاقيه وبالرغم اني بكتبه البطريقه الصحيحه وكمان جربته من المصدر الرئيسي وكمان جربت طريقة تانيه ومش لاقي الكود ده خالص

انا ضايف استايل تقريبا لاعب في الاكود

جربت تعمل صح على
Expand template elements
?

انا فعلا عملت الي انتا قولت عليه ولقيت الكود وبدلته بس طلع خطأ في الكود التاني

XML error message: The element type "b:includable" must be terminated by the matching end-tag "".

ابحث عن دة
[html]<dataost.body/>[/html]

بحثت عنه مش موجود خالص

المشكله ان تقريبا التمبلت الي انا حاطة مغير في بعض الاسماء انا متوقع كدا

عملت زي ما عبدو باشا قالك؟؟
لازم تعلم علي Expand widget template ??

انا عملت وفعلا الكود ظهر المشكله في الكود التاني

في ملحوظه الكود ده انا لقيته <dataost.body/>

بس الكود الي هابدله مش موجود زي ما هو مكتوب هنا ومش عارف ابدل ايه

الكود الي موجود عندي هو ده

<div class='entry'>
<p><dataost.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
<span class='star-ratings'>
<b:if cond='data:top.showStars'>
<div expr:g:background-color='data:backgroundColor' expr:g:text-color='data:textColor' expr:g:url='dataost.absoluteUrl' g:height='42' g:type='RatingPanel' g:width='180'/>
</b:if>
</span>

<script language='JavaScript'>var OutbrainPermaLink=&#39;<dataost.url/>&#39;;var OB_demoMode = false;var OB_****** = true;</script><script src='http://widgets.outbrain.com/OutbrainRater.js' type='text/javascript'/>


</div>

انت عامل التقييم بالنجوم للمواضيع؟

ايوه .. واعذرني انا ضفتك علي الاميل لو مش يدايقك

مافيش مشكلة و حاكلمك بكرة ان شاء الله لاني هاقوم دلوقتي

اوكـ ياقمر ومعلش انا تعبتك معايا

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

انا لاحظت ان مدونتك فيها كلمة اقراء المزيد بس بتجيلك كل المقالة فى الصفحة يعنى الكومنتز بس هى اللى فى الجزء المخفى

ودا انا مش عايزه انا عايزة الاختصار لمواضيع بحيث يظهر مثلا خمس سطور من الموضوع لان مدونتى سعات بنزل فيها موضوع عن الازياء مثلا فبنزل صور كتير ودا اكيد بيضيق الزائر لانه بيقى مش عايز يشوف الموضوع ومضطر انه ينزل تحت لغاية لما يشوف الموضوع اللى بعده فياريت تقولى انى طريقة فى دول تنفعنى بحيث اختصر كل موضوع فى الصفحة الرئيسة الى 5 سطور بالكتير
وكمان لانى بحب احط مواضيع كتير فى الصفحة الرئسية يعنى اقل حاجة 6 مواضيع فدا بيتقل تحميل الصفحة لاكن الاختصار ده هيفدنى اكتير ولو متنفعش اى طريقة ممكن اعمل اية ..؟

يارب مااكون تقيلة عليك

منتظرة ردك

مافيش تقل ولا حاجة و اسألي براحتك....

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

المشكلة دي اعتقد عندك انتي بس لانها شغالة عندي كويس و في ناس ردوا قبل كدة وانتي كنتي رديتي برده قبل كدة....
ممكن تقوليلي المتصفح بتاعك ايه؟؟ و المشكةل دي حصلت امتي بالظبط ؟
وهنا او هناك واحد

انا لاحظت ان مدونتك فيها كلمة اقراء المزيد بس بتجيلك كل المقالة فى الصفحة يعنى الكومنتز بس هى اللى فى الجزء المخفى

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

ودا انا مش عايزه انا عايزة الاختصار لمواضيع بحيث يظهر مثلا خمس سطور من الموضوع لان مدونتى سعات بنزل فيها موضوع عن الازياء مثلا فبنزل صور كتير ودا اكيد بيضيق الزائر لانه بيقى مش عايز يشوف الموضوع ومضطر انه ينزل تحت لغاية لما يشوف الموضوع اللى بعده فياريت تقولى انى طريقة فى دول تنفعنى بحيث اختصر كل موضوع فى الصفحة الرئيسة الى 5 سطور بالكتير
وكمان لانى بحب احط مواضيع كتير فى الصفحة الرئسية يعنى اقل حاجة 6 مواضيع فدا بيتقل تحميل الصفحة لاكن الاختصار ده هيفدنى اكتير ولو متنفعش اى طريقة ممكن اعمل اية ..؟

يارب مااكون تقيلة عليك

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

منتظر ردك بخصوص المتصفح..
شكرا

طب انى طريق اللى تدينى اختصار المقالة فى اربع او خمس سطور

بالنسبة لمتصفحى ويندوز xp

وانا بعمل الطريقة الاولى قالى لما جيت ع خاصية معاينة "عذرًا، لم نتمكن من استكمال طلبك" ؟؟؟

لا اقصد متصفح النت بتاعك ... يعني فايرفوكس ولا اكسبلورر؟؟
و للاسف ماقدرش الخصلك لموضوع لان كل سطر فيه مهم...
و يستحسن تشوفيه في المدونة عشان هنا الاكواد ساعات بتكون بايظة...
بخصوص المشكلة ....فافي حاجة غلط اتعملت ولازم تعيديها تاني....

لا اقصد متصفح النت بتاعك ... يعني فايرفوكس ولا اكسبلورر؟؟

اكسبلورر


هما الاكواد كده كما فى مدونتك

****** 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>

ـــــــــــــــــــــــــــــ
كود الاستبدال
<div class='post-body entry-content'>
<dataost.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
ــــــــــــــــــــــــــــــــ

نضع ده مكانه
<b:if cond='data:blog.pageType != "item"'>
<div class='excerpt post-body entry-content'>
<dataost.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
<b:else/>
<div class='post-body entry-content'>
<dataost.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
</b:if>

بخصوص المشكلة ....فافي حاجة غلط اتعملت ولازم تعيديها تاني....

طب الحل اية ؟؟

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