بسم الله الرحمن الرحيم
كيفية اضافة أداة مواضيع ذات صلة لمدونات بلوجر
من تصميم ادخل علي تحرير HTML
ثم توسيع العناصر

لا تنسي أن تأخد نسخة إحتياطية لمدونتك قبل البدأ 

اضغط علي (CTRL+F) وابحث عن الكود التالي : 
</head>

 ثم ضع فوقه الكود التالي

<!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove --><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.6em;
font-weight: bold;
color: black;
font-family: 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 type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxHvqCzWi0_eLGZlBk2_-Vqd0xSk6g6i8CHUZ-fDCQnj4-sADerRGqI93YwDGm8lMIhMB33nnRmKGeWS7g5QV3nOjYemKUxShmHXx9IgdsdFC46_MuhaHgPqh9xXtfiWF7e8rF_f5VBGg/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="مواضيع ذات صلة ";
</script>
<script src='http://egymodern.googlecode.com/files/related-posts-with-thumbnails-for-blogger-pro.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->


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

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

ثم قم بوضع الكود التالي تحت الكود السابق

 <!-- Related Posts with Thumbnails Code Start-->
<!-- remove --><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'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if> 
<!-- Related Posts with Thumbnails Code End-->

 بعد ذلك قم بحفظ القالب ومبروك عليك الاضافة
شكر خاص للأخ أبو اياد

6 التعليقات:

  1. جميل، اود فقط الإشارة اذا كان ممكنا ان قالب الحالى الذي تستعمله في مدونتك، ربما غفلت عن تعديل بعض الامور منها :
    كلمة read more التي يمكنك تعريبها بسهولة و التي تظهر جليا في إظهار المقالات على شكل قائمة.
    أيضا، جزء التعليقات يظهر باللغة الإنجليزية، يمكن تغييره إنطلاقا من إعدادات المدونة كما لا يخفى عليك.
    و أيضا ان تأخد بالك من padding / margin المكون من اربعة اطراف خاصة التاني و الرابع قم بإستبدالهما ببعضهما البعض..
    هذا و الله اعلم . تقبل مني فائق الإحترام.

    ردحذف
  2. شكرااااااااا علي الشرح

    ردحذف
  3. أزال المؤلف هذا التعليق.

    ردحذف