إضافة "تدوينات ذات صلة" لمدونات بلوجر

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


لـن أطوّل عليك ونمرّ إلى الشرح :
ندخل على قالب تحرير HTML توسع خانة مربع البحث
ومن ثمّ نبحث عن الكود الأتي باستعمال العلامة الاتية CTRL + F 

</head>


فوقه مباشرة نقوم بوضع الوسم الاتي :

<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 1.3em;
font-weight: bold;
color: black;
font-family: Tahoma, Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}

#related-posts  a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://sma-blogger.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->


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


<div class='post-footer-line post-footer-line-1'>


إذا لم تجده في قالبك إبحث عن هذا الكود :


<p class='post-footer-line post-footer-line-1'>


ثمّ أضف الكوذ التالي بعد الكود السابق مباشرة : 


<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
var relatedpoststitle="مواضيع ذات صلة";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if> 
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://rifed-blog.blogspot.com' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://rifed-blog.blogspot.com' style='display:none;'>RifedBlog</a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->


ملاحظة :
لتغيير عبارة تدوينات ذات صلة بأخرى من اختيارك 

var relatedpoststitle="تدوينات ذات صلة";

لتغيير عدد التدوينات التي ستظهر في الإضافة

var maxresults=5;

لتغيير لون الخلفية التي تظهر عند التأشير بالفأرة

background-color:#d4eaf2;

لتغيير حجم خط الإضافة

font-size: 1.3em;

لتغيير نوع خط الإضافة

font-family: Tahoma, Georgia




تعليقات

المشاركات الشائعة من هذه المدونة

كود المساحات الاعلانيه الرائع

طرق جلب الزوار الجزء الثاني

أكواد HTML مهمة لكل مدون بلوجر