إضافة المواضيع الأكثر تعليق لمدونات بلوجر

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

معاينة

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

تركيب إضافة المواضيع الأكثر تعليق

تركيب الإضافة سهل جداً كل ما عليك هو التوجه إلى التخطيط ثم إنشاء أداة "شششش" في المكان الذي تريد أن تظهر فيه الإضافة وضع الكود التالي فيها

<style type='text/css'>
#most-comments li,#most-comments ul,#most-comments ul li{
    margin:0;
    list-style:none;
    color:#444;
    font-family:cursive,droid arabic kufi;
    font-size:11px;
    text-align: right;
}
#most-comments ul li{
    position:relative;
    overflow:hidden;
    background:#fff;
    margin:3.5px 0;
    padding:7px 50px 7px 10px;
    white-space:nowrap;
    text-overflow:ellipsis;
    box-shadow:inset 0 0 #7343a8;
    border:1px solid #e6e6e6;
    transition:all .6s
}
#most-comments ul li:hover{
    box-shadow:inset 310px 0 #7444aa
}
#most-comments ul li a{
    color:#444;
    font-weight:700;
    text-decoration:none;
    transition:all .3s
}
#most-comments ul li a:hover,#most-comments ul li:hover a{
    color:#fff
}
.count-most{
    position:absolute;
    right:0;
    top:0;
    width:40px;
    height:100%;
    margin:0;
    padding:7px 0;
    background-color:#9f5de8;
    color:#fff!important;
    text-align:center;
    transition:all .3s
}
#most-comments ul li:hover .count-most{
    background-color:#7444aa
}
#most-comments ul div:first-of-type .mnqush-imgs{
    display: block;
order: 1px solid #e6e6e6;
    margin: 0 0 -4px 0;
}
#most-comments ul div:first-of-type a:hover{opacity: 0.8;}
#most-comments ul div:first-of-type .mnqush-imgs a{
    display: grid;
}
#most-comments ul div:first-of-type li{
    box-shadow: inset 310px 0 #59afec;
    color: #fff;
    margin: 0px 00px 0;
    border: none;
}
#most-comments ul div:first-of-type .count-most{
    background-color: #478dc1;
}
#most-comments ul div:first-of-type li a{
color: #fff;
}
.grop-abdualla .mnqush-imgs{
    display: none;
}
</style>

<div class='div-wad'>
<script type='text/javascript'>
var numPosts=8;
var homePage="";
var postTitlear=new Array();
var imgwnr=new Array();
var postUrlar=new Array();
var postCommentar=new Array();
var totalpost;document.write('<div id="most-comments"><ul>');
function most43Comment(j){var a=j.feed.entry.length;totalpost=a;
for(var f=0;f<a;f++){
var h=j.feed.entry[f];
var im=h.media$thumbnail.url
var c=h.title.$t;var b;
var g;if(f==j.feed.entry.length){break}
for(var d=0;d<h.link.length;d++){
if(h.link[d].rel=="alternate"){g=h.link[d].href;break}}
for(var d=0;d<h.link.length;d++){
if(h.link[d].rel=="replies"&&h.link[d].type=="text/html"){b=h.link[d].title.split(" ")[0];}};
postTitlear.push(c);
imgwnr.push(im);
postUrlar.push(g);
postCommentar.push(b)}sortPosts();
for(var f=0;f<numPosts;f++){var e='<div class="grop-abdualla"><div class="mnqush-imgs"><a href="'+postUrlar[f]+'" target ="_top"><img class="label_thumb" style="width:100%;" src="'+imgwnr[f]+'"/></a></div><li><span class="count-most">'+postCommentar[f]+'</span><a href="'+postUrlar[f]+'" title="'+postTitlear[f]+'" target="_blank">'+postTitlear[f]+'</a></div>';
document.write(e)}}
function sortPosts(){function c(d,f){var e=postTitlear[d];
postTitlear[d]=postTitlear[f];
postTitlear[f]=e;
var e=postUrlar[d];
postUrlar[d]=postUrlar[f];
postUrlar[f]=e;
var e=imgwnr[d];
imgwnr[d]=imgwnr[f];
imgwnr[f]=e;
var e=postCommentar[d];
postCommentar[d]=postCommentar[f];
postCommentar[f]=e}
for(var b=0;b<postTitlear.length-1;b++){
for(var a=b+1;a<postTitlear.length;a++){
if(parseInt(postCommentar[b])<parseInt(postCommentar[a])){c(b,a)}}}}

document.write('</li>')
document.write('</ul>')
document.write('</div>');
</script>
</div>

<div id="most-comments">
<ul>
<script src="/feeds/posts/default?max-results=9999&orderby=published&alt=json-in-script&callback=most43Comment"></script>
</ul>

</div>

<script type='text/javascript'>
$(document).ready(function() {
$('.label_thumb').attr('src', function(i, src) {return src.replace( 's72-c', 's500' );});
$('.label_thumb').attr('src', function(i, src) {return src.replace( '/default.jpg', '/mqdefault.jpg' );});
});
</script>

هنا نكون قد انتهينا من الإضافة وانتظرونا في الموضوع القادم تابعناً لكي لا تفوت عليك  المواضيع الحصريا
المصدر عبدالله منقوش