تعتبر اضافة اقرأ المزيد من اهم اضافات بلوجر الموصى بها , حيث تجعل شكل المدونة منسق وجذاب اكثر , واليك الاكواد والطريقة الصحيحة الوحيدة لاضافتتها بدون اخطاء .
من المهم جدا اخذ نسخة من قالب مدونتك قبل اجراء أى تعديلات عليه وذلك للاحتياط , فلو حدث اى خطأ فى اضافة كود معين لن تخسر قالبك.
تابع معى الشرح المصور لاضافة كود اقرأ المزيد وتلخيص مقالاتك فى مدونات بلوجر وهى كما اخبرتكم من أهم الاضافات.
أولا اذهب الى لوحة تحكم بلوجر https://www.blogger.com/ ثم الى مدونتك فى بلوجر ثم تابع الشرح :
اذهب الى قالب ثم HTML :
كما توضح لك الصورة بالاعلى:
1- انقر فوق قالب للتعديل فى قالب مدونتك سيظهر لك تبويب التعديل على القالب .
2- انقر فوق HTML للذهاب الى الكود الكامل الخاص بمدونتك تن صح التعبير .
الان عليك تخذ نسخة احتياطيه من القالب بالنقر فوق الكود ثم كليك يمين و اختار SELECT ALL أو من لوحة المفاتىح CTRL+A ثم كليك يمين وCOPY او CTRL +C الان اذهب واحفظ نسخة قالبك فى ملف خارج على صفحة وورد او ملف .TXT
تابع الشرح لمعرفة الطربقة الصحبحة لاضافة كود اقرأ المزيد وتلخيص المقالات تلقائيا فى مدونات بلوجر
1- من لوحة المفاتيح اضغط على CTRL+F سيظهر مربع للبحث داخل القالب , ابحث عن </head> .
2- قم بلصق هذا الكود فوقها مباشرة كما يوضح السهم فى الصورة بالاعلى .
<!-- readmore by mahmoud hassan -->
<script type='text/javascript'>
posts_no_thumb_sum = 490;
posts_thumb_sum = 400;
img_thumb_height = 160;
img_thumb_width = 180;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID, pURL, pTITLE){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = posts_no_thumb_sum;
if(img.length>=1) {
imgtag = '<span class="posts-thumb" style="float:right; margin-right: 10px;"><a href="'+ pURL +'" title="'+ pTITLE+'"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px" /></a></span>';
summ = posts_thumb_sum;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<style type='text/css'>
.post-footer {display: none;}
.post {margin-bottom: 10px; border-bottom: 1px dotted #E6E6E6; padding-bottom: 20px;}
.readmore a {text-decoration: none; }
</style>
</b:if>
</b:if>
<!-- readmore by mahmoud hassan -->
الكلمات باللون الاحمر يمكن تغيرها على حسب زوقك وتنسيق مدونتك
الخطوة الثانية من الطربقة اصحيحة لاضافة كود اقرأ المزيد لبلوجر وتلخيص المقالات تلقائيا
الان ابحث ايضا عن هذا الكود
<data:post.body/>
واستبدله بهذا الكود :::: ملحوظه هامه اقصد باستبدله :اى تحديده ووضع الكود الجديد بدلا منه :::: هناك كودىن من هذا النوع غالبا يكون الكود الثانى : بمعنى بعد الضغط على CRRL+F ووضع الكود <data:post.body/> للبحث عنه ستجد منه كودين عليك ان تستبدل الثانى بالكود الجديد فى الاسفل .<!-- readmore by mahmoud hassan -->
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>","<data:post.url/>","<data:post.title/>");</script>
<span class='readmore' style='float:left;'><a expr:href='data:post.url'>اقرأ المزيد »</a></span></b:if></b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
<b:if cond='data:blog.pageType == "static_page"'><data:post.body/></b:if>
<!-- readmore by mahmoud hassan -->
الان انقر فوق حفظ النموذج واذهب الى مدونتك سترى كلمة اقرأ المزيد تتألق اسفل كل تدوينه على الصفحة الرئيسية.
اما ان اردت استبدال كلمة اقرأ المزيد بصورة اقرأ المزيد قم بتحديد كلمة اقرأ المزيد فى الكود الثانى التى باللون الاحمر بالكود الذى يناسبك فى الصور التالية:
http://www12.0zz0.com/2013/02/25/18/420986322.jpg
http://www12.0zz0.com/2013/02/25/18/361578084.jpg
http://www12.0zz0.com/2013/02/25/18/764150527.jpg
http://www12.0zz0.com/2013/02/25/18/894884363.jpg
http://www12.0zz0.com/2013/02/25/18/764687227.jpg
http://www12.0zz0.com/2013/02/25/18/847472384.jpg
http://www14.0zz0.com/2012/11/25/04/556505743.jpg
http://www11.0zz0.com/2012/11/27/22/152898214.png
http://www11.0zz0.com/2012/11/27/22/859846975.png
رائع شرح وافي ومنسق جدا
ردحذف