التدوينات الأكثر تعليقا بعداد التعليقات

السلام عليكم

ورحمة الله

وبركاته

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

معاينة

طريقة التركيب

1. من التخطيط قم بانشاء أداة html/javascript
2. ثم قم بلصق الأكواد التالية داخل الأداة

• <div id="most-comments"></div>
• <style scoped='' type='text/css'>
• #most-comments ul,#most-comments li,#most-comments ul li {
•     margin: 0;
•     list-style: none;
•     color: #999;
•     font-size: 14px;
• }
• 
  
• #most-comments ul li {
•     position: relative;
•     overflow: hidden;
•     background: #fff;
•     margin: 3.5px 0;
•     text-align: right;
•     padding: 10px 10px 10px 50px;
•     white-space: nowrap;
•     text-overflow: ellipsis;
•     border-bottom: 1px dotted #eee;
•     transition: all .6s;
• }
• 
  
• #most-comments ul li:hover {
•     box-shadow: inset 310px 0 #f24a4a;
•     border-radius: 2px;  
• }
• 
  
• #most-comments ul li a {
•     color: #243140;
•     text-decoration: none;
•     transition: all .3s;
• }
• 
  
• #most-comments ul li a:hover {
•     color: #fff;
• }
• 
  
• #most-comments ul li:hover a {
•     color: #fff;
• }
• 
  
• .count-most {
•     position: absolute;
•     left: 0;
•     top: 0;
•     width: 30px;
•     height: 20px;
•     margin: 0;
•     padding: 5px 0 0 0;
•     margin: 5px 0 3px 0;
•     border-radius: 3px;
•     background: #f4f4f4;
•     color: #999!important;
•     text-align: center;
•     transition: all .3s;
• }
• 
  
• #most-comments ul li:hover .count-most {
•     background: none;
•     color:#fff!important;
• }
• </style>
• <script type='text/javascript'>
• //<![CDATA[
• var numPosts=10;
• var homePage="issamweeb.blogspot.com";
• var postTitlear=new Array();
• var postUrlar=new Array();
• var postCommentar=new Array();
• var totalpost;document.write('<div id="most-comments"><ul>');
• function mostComment(j){var a=j.feed.entry.length;totalpost=a;
• for(var f=0;f<a;f++){
• var h=j.feed.entry[f];
• 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);
• postUrlar.push(g);
• postCommentar.push(b)}sortPosts();
• for(var f=0;f<numPosts;f++){var e='<li><span class="count-most">'+postCommentar[f]+'</span><a href="'+postUrlar[f]+'" title="'+postTitlear[f]+'" target="_blank">'+postTitlear[f]+'</a>';
• 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=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('<script src="https://'+homePage+'/feeds/posts/default?max-results=9999&orderby=published&alt=json-in-script&callback=mostComment"><\/script>');
• document.write('</li>')
• document.write('</ul>')
• document.write('</div>');
• //]]>
• </script>

الرقم باللون الأصفر هو عدد التدوينات المراد ظهورها والرابط بالأزرق هو رابط المدونة قم بتغييره برابطك