المشاركات الشائعة بعدد التعليقات وتاريخ النشر



السلام عليكم ورحمة
الله وبركاته


 نعود لكم بتدوينة جديدة نقدم لكم أداة المشاركات الشائعة والتي
يعرفها الجميع لكن هذه المرة بشكل جديد
كما قمنا باضافة عدد التعليقات وتاريخ النشر
الخاصة بالتدوينات





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

    1. توجه الى التخطيط ثم اضف اداة html/javascript
    2. ضع كود التالي داخل الاداة


      <script type="text/javascript">
      function showlatestpostswiththumbs(t){document.write('<ul class="recent-posts-container">');for(var e=0;e<posts_no;e++){var r,n=t.feed.entry[e],i=n.title.$t;if(e==t.feed.entry.length)break;for(var o=0;o<n.link.length;o++){if("replies"==n.link[o].rel&&"text/html"==n.link[o].type)var l=n.link[o].title,m=n.link[o].href;if("alternate"==n.link[o].rel){r=n.link[o].href;break}}var u;try{u=n.media$thumbnail.url}catch(h){s=n.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),u=-1!=a&&-1!=b&&-1!=c&&""!=d?d:"https://2.bp.blogspot.com/-C3Mo0iKKiSw/VGdK808U7rI/AAAAAAAAAmI/W7Ae_dsEVAE/s1600/no-thumb.png"}var p=n.published.$t,f=p.substring(0,4),g=p.substring(5,7),v=p.substring(8,10),w=new Array;if(w[1]="Jan",w[2]="Feb",w[3]="Mar",w[4]="Apr",w[5]="May",w[6]="Jun",w[7]="Jul",w[8]="Aug",w[9]="Sep",w[10]="Oct",w[11]="Nov",w[12]="Dec",document.write('<li class="recent-posts-list">'),1==showpoststhumbs&&document.write('<a href="'+r+'"><img class="recent-post-thumb" src="'+u+'"/></a>'),document.write('<div class="recent-post-title"><a href="'+r+'" target ="_top">'+i+"</a></div>"),"content"in n)var A=n.content.$t;else if("summary"in n)var A=n.summary.$t;else var A="";var k=/<\S[^>]*>/g;if(A=A.replace(k,""),1==post_summary)if(A.length<summary_chars)document.write(A);else{A=A.substring(0,summary_chars);var y=A.lastIndexOf(" ");A=A.substring(0,y),document.write(A+"...")}var _="",$=0;document.write('<br><div class="recent-posts-details">'),1==posts_date&&(_=_+w[parseInt(g,10)]+" "+v+" "+f,$=1),1==readmorelink&&(1==$&&(_+=" | "),_=_+'<a href="'+r+'" class="url" target ="_top">اقرأ المزيد</a>',$=1),1==showcommentslink&&(1==$&&(_+="  "),"1 Comments"==l&&(l="1 Comment"),"0 Comments"==l&&(l="No Comments"),l='<a href="'+m+'" target ="_top">'+l+"</a>",_+=l,$=1),document.write(_),document.write("</div>"),document.write("</li>")}document.write("</ul>")}
      </script>
      <script type="text/javascript">
      var posts_no = 5;
      var showpoststhumbs = true;
      var readmorelink = true;
      var showcommentslink = true;
      var posts_date = true;
      var post_summary = true;
      var summary_chars = 40;</script>
      <script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs"></script>
      <noscript>Your browser does not support JavaScript!</noscript>
      <link href='https://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>
      <style type="text/css">
      img.recent-post-thumb{padding:2px;width:65px;height:65px;float:right;margin:0px 0px 10px 10px;border: 1px solid #69B7E2;}
      .recent-posts-container {font-family:'Oswald', sans-serif;font-size:12px;}
      ul.recent-posts-container li{list-style-type: none; margin-bottom: 10px;font-size:9px;color: #908d8d;float:left;width:100%}
      ul.recent-posts-container {counter-reset: countposts;list-style-type:none;padding:0;}
      ul.recent-posts-container li:before {content: counter(countposts,decimal);counter-increment: countposts;z-index: 1;position:absolute; font-size: 13px;font-weight: bold;color: #fff;background: #69B7E2;line-height:25px;height:25px;width:25px;text-align:center;}
      .recent-posts-container a{text-decoration:none;}
      .recent-post-title {margin-bottom:5px;}
      .recent-post-title a {font-size:12px; text-transform: uppercase; color: #2aace3;}
      .recent-posts-details {margin: 5px 0px 0px 12px;font-size:11px;}
      .recent-posts-details a:first-child {
          float: left;
          background: #69b7e2;
          color: white;
          padding: 0 6px;
          margin-right: 4px;
      }
      .recent-posts-details a{color: #777;    float: left;}
      </style>


        1. ثم قم بتغيير ما يلي                                                 
        2. var posts_no = 5; بعدد المشاركات


        1. اذا واجهت اي مشكلة ضعها بتعليق



      ليست هناك تعليقات:

      إرسال تعليق