إضافة مواضيع ذات صلة بشكل مذهل لمدونات بلوجر 2016

1. لوحة التحكم>>القالب>>تحرير html
2. ثم نبحث عن  </head> وضع الكود التالي  فوقه مباشرة

<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {
background: #FFFFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOEmnOFxOn1YGbwjZY_2SGEfqoDyOJsMF5j7rRcUSo-jPo9CLPMvr5TK8T4JlR56-RsndaM3mz0Im5kTwqP-9jF43koH9YTKA5YnKkV1YXaVyqjEuD05lhwqKFZls50Hlls4uqNe1ai555/s1600/repeat-all.png);
    height: 225px;
    width: 99.6%;
    border: 1px solid #E2E1E1;
    float: center;
    text-transform: none;
    /* height: 100%; */
    min-height: 100%;
    padding-top: 5px;
    padding-left: 0px;
}
.reated-posts {
    background: #FFFFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOEmnOFxOn1YGbwjZY_2SGEfqoDyOJsMF5j7rRcUSo-jPo9CLPMvr5TK8T4JlR56-RsndaM3mz0Im5kTwqP-9jF43koH9YTKA5YnKkV1YXaVyqjEuD05lhwqKFZls50Hlls4uqNe1ai555/s1600/repeat-all.png);
    height: 225px;
    width: 100.4%;
    border: 1px solid #E2E1E1;
}
#related-posts h2{
    font-size: 14px;
    font-weight: bold;
    color: #666666;
    font-family: Tahoma, Georgia, &#8220;
    margin-bottom: 0.75em;
    margin-top: 0em;
    padding-top: 10px;
    background: #FFFFFF;
    width: 178px;
    padding-bottom: 10px;
    margin-right: 13px;
    padding: 10px 3px 10px 0px;
    border-radius: 4px 0px 0px 4px;
}
#related-posts h2:before {
    content: &#39;\f005&#39;;
    font-family: FontAwesome;
    font-style: normal;
    font-weight: bolder;
    background: #FFFFFF;
    color: #0894D8;
    line-height: 19px;
    border-left: 3px double #FFFFFF;
    height: 41px;
    width: 16px;
    padding: 6px 12px;
}
#related-posts a{
color: white;
    margin-left: 3px;
    margin-right: 12px;
    background: #34495E;
    width: 92px;
border-bottom: 3px solid #0894D8;
}
#related-posts a:hover{
color:black;
}
#related-posts  a:hover {
background-color: #0894D8;
    border-bottom: 3px solid #34495E;
    transition: 0.5s;
}
#related-posts a img {
    width: 92px !important;
    height: 72px !important;
    border-radius: 0px;
}
</style>
<script src='http://sma-blogger.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

1. ثم ابحث <data:post.body/> و ضع الكود التالي بعده 

<!-- 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=7&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=7;
var relatedpoststitle=&quot;مواضيع ذات صلة&quot;;
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://alb33dani.blogspot.com' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://profmasterissam.blogspot.com' style='display:none;'>EfadaBlog</a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->