أصافه المشاركات الأخيرة لبلوجر ..1..

أصافه المشاركات الأخيرة لبلوجر

هذه التدوينه لاضافات مهمه للمدونات وهى الحل الامثل لكى تضع جميع ما نشرته مؤخرا امام القراء و هى ادوات حرفيه وتظهر المدونه بمظهر محترف

كل هذه الادوات مصممة بشكل جميل وتم اختبارها .

نآمل أن تتمكن من إضافة واحده من هذه الاداوات إلى مدونتك دون أي تردد.

وسوف نضع فى هذه المشاركه تعليمات الإضافة لهذه الادوات.

اولا:- اداه حرفيه و مصممه بشكل احترافى جميل وصور مصغره

الكود
لسخ الكود فى جميع الاضافات
Select All ثم CTRL + C

<script style="text/javascript" >     function showlatestpostswiththumbs(json) {      document.write('<ul class="recent-posts-container">');      for (var i = 0; i < posts_no; i++) {        var entry = json.feed.entry[i];        var posttitle = entry.title.$t;        var postsurl;        if (i == json.feed.entry.length) break;        for (var k = 0; k < entry.link.length; k++) {          if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {            var commentstext = entry.link[k].title;            var commentsurl = entry.link[k].href;          }          if (entry.link[k].rel == 'alternate') {            postsurl = entry.link[k].href;            break;          }        }        var recenthumb;        try {          recenthumb = entry.media$thumbnail.url;        } catch (error) {          s = entry.content.$t;          a = s.indexOf("<img");          b = s.indexOf("src=\"", a);          c = s.indexOf("\"", b + 5);          d = s.substr(b + 5, c - b - 5);          if ((a != -1) && (b != -1) && (c != -1) && (d != "")) {            recenthumb = d;          } else recenthumb = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGXYancVWEFnnSn2h1w4ZphA6nwZBQVtuu4vYH0UR9lIUcjD_WzQLN_MPK0D1TfA2ETSdDAQLs5r3xfyIkazXYrkG15NKG670Vx0w6elj6JNNuO5VeAPtL4UMgFhPrstIfeL9nZkkQguVO/s1600/no-thumb.png';        }        var postdate = entry.published.$t;        var showyear = postdate.substring(0, 4);        var showmonth = postdate.substring(5, 7);        var showday = postdate.substring(8, 10);        var monthnames = new Array();        monthnames[1] = "Jan";        monthnames[2] = "Feb";        monthnames[3] = "Mar";        monthnames[4] = "Apr";        monthnames[5] = "May";        monthnames[6] = "Jun";        monthnames[7] = "Jul";        monthnames[8] = "Aug";        monthnames[9] = "Sep";        monthnames[10] = "Oct";        monthnames[11] = "Nov";        monthnames[12] = "Dec";        document.write('<li class="recent-posts-list">');        if (showpoststhumbs == true)          document.write('<a href="' + postsurl + '"><img class="recent-post-thumb" src="' + recenthumb + '"/></a>');        document.write('<div class="recent-post-title"><a href="' + postsurl + '" target ="_top">' + posttitle + '</a></div>');        if ("content" in entry) {          var postcontent = entry.content.$t;        } else        if ("summary" in entry) {          var postcontent = entry.summary.$t;        } else var postcontent = "";        var re = /<\S[^>]*>/g;        postcontent = postcontent.replace(re, "");        if (post_summary == true) {          if (postcontent.length < summary_chars) {            document.write(postcontent);          } else {            postcontent = postcontent.substring(0, summary_chars);            var quoteEnd = postcontent.lastIndexOf(" ");            postcontent = postcontent.substring(0, quoteEnd);            document.write(postcontent + '...');          }        }        var posts_details = '';        var flag = 0;        document.write('<br><div class="recent-posts-details">');        if (posts_date == true) {          posts_details = posts_details + monthnames[parseInt(showmonth, 10)] + ' ' + showday + ' ' + showyear;          flag = 1;        }        if (readmorelink == true) {          if (flag == 1) posts_details = posts_details + ' | ';          posts_details = posts_details + '<a href="' + postsurl + '" class="url" target ="_top">Read more</a>';          flag = 1;;        }        if (showcommentslink == true) {          if (flag == 1) {            posts_details = posts_details + ' <br> ';          }          if (commentstext == '1 Comments') commentstext = '1 Comment';          if (commentstext == '0 Comments') commentstext = 'No Comments';          commentstext = '<a href="' + commentsurl + '" target ="_top">' + commentstext + '</a>';          posts_details = posts_details + commentstext;          flag = 1;;        }        document.write(posts_details);        document.write('</div>');        document.write('</li>');      }      document.write('</ul>');    } </script>    <script style="text/javascript">    var posts_no =  5 ;    var showpoststhumbs =  true ;    var readmorelink =  true ;    var showcommentslink =  false ;    var posts_date =  true ;    var post_summary =  true ;    var summary_chars =  70 ;    </script>    <script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs"></script>    <a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="https://modountiy.blogspot.com.eg/" rel="nofollow">Recent Posts Widget</a>    <noscript>Your browser does not support JavaScript!</noscript>    <link href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed' rel='stylesheet' type='text/css' />    <style type="text/css">    img.recent-post-thumb {width:50px;height:50px;float:right;margin: 5px -5px 0px 0px; border-radius: 100%; padding: 3px;background: #fff}    .recent-posts-container {font-family: 'Ubuntu Condensed', sans-serif; float: left;width: 100%;min-height: 55px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}    ul.recent-posts-container {list-style-type: none; background: #fff;padding: 0px; }    ul.recent-posts-container li:nth-child(1n+0) {background: #F49A9A; width: 100%}    ul.recent-posts-container li:nth-child(2n+0) {background: #FCD092; width: 95%}    ul.recent-posts-container li:nth-child(3n+0) {background: #FFF59E; width: 90%;}    ul.recent-posts-container li:nth-child(4n+0) {background: #E1EFA0; width: 85%;}    ul.recent-posts-container li:nth-child(5n+0) {background: #B1DAEF; width: 80%;}    ul.recent-posts-container li {padding:5px 10px;min-height:50px; list-style-type: none; margin: 0px 5px -5px 5px; color: #777;}    .recent-posts-container a { text-decoration:none; }    .recent-posts-container a:hover { color: #222;}    .post-date {color:#e0c0c6; font-size: 11px; }    .recent-post-title a {font-size: 14px;color: #444; font-weight: bold;}    .recent-post-title {padding: 6px 0px;}    .recent-posts-details a{ color: #222;}    .recent-posts-details {padding: 5px 0px 5px; }    </style>

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

أفضل شيء هو، يمكن لزوار الموقع أيضا رؤية المشاركات السابقة من خلال نظام الملاحة فى هذه الاداه.

<style scoped='' type='text/css'>/* Recent Post Widget */ #recentpostnav{width:100%;border:1px solid #585858;margin:0 auto} #borpbox{margin:0} .recentposarea{display:block;background:#fff;height:79px;border:1px solid #ddd;margin:5px 0;padding:10px} .recentposarea img{float:right;background:#fff;border:1px solid #ddd;margin-right:8px;padding:4px;height:70px;width:70px} .recentposarea h6,.recentposarea h6 a{text-decoration:none;margin:0;color:#111;font-size:13px!important;font-weight:700!important;} .recentposarea:hover{background-color:#fefefe} .recentposarea p{text-align:left;font-size:12px;margin:5px 0;color:#555;line-height:normal} #loadrecentpost{font-family:Tahoma;color:#888;font-size:100px;letter-spacing:-10px;text-shadow:-5px 0 1px #444;text-align:center;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifGLgzEh07vNgPFQyDMNLLLAZA_4MIr75qYswFNYGKh4-coa0nABZO4GQkSwl2CBOQYv-YHGpl6zX777W1uwUWLniktywDNyKmYPDyOsyvfYg9pHTsvYvWTo1JhB35uElHY-vxDQJ-Pp87/s1600/loader.gif) 50% 50% no-repeat #fff;height:470px;border:1px solid #ddd} #rpnavigation{color:#bbb;border:1px solid #ddd;font-family:Verdana;text-align:center;font-size:12px;margin:0} #rpnavigation:hover{background-color:#fefefe} #rpnavigation a{color:#141414!important;font-family:Tahoma!important;font-size:12px!important;font-weight:400!important;display:block;padding:5px 10px} #rpnavigation span{padding:5px 10px} #rpnavigation .next{float:right} #rpnavigation .previous{float:left} #rpnavigation .home{text-align:center} #rpnavigation a:hover,#rpnavigation span.noactived{color:transparant!important} </style><script type='text/javascript'>//<![CDATA[     var numfeed = 5;     var startfeed = 0;     var urlblog = "https://modountiy.blogspot.com.eg/";     var charac = 40;     var urlprevious, urlnext; function arlinafeed(e,t){for(var n=e.split("<"),r=0;r<n.length;r++)-1!=n[r].indexOf(">")&&(n[r]=n[r].substring(n[r].indexOf(">")+1,n[r].length));return n=n.join(""),n=n.substring(0,t-1)}function showrecentpostsae(e){var t,n,r,a,i,s="";urlprevious="",urlnext="";for(var l=0;l<e.feed.link.length;l++)"previous"==e.feed.link[l].rel&&(urlprevious=e.feed.link[l].href),"next"==e.feed.link[l].rel&&(urlnext=e.feed.link[l].href);for(var d=0;d<numfeed&&d!=e.feed.entry.length;d++){t=e.feed.entry[d],n=t.title.$t;for(var l=0;l<t.link.length;l++)if("alternate"==t.link[l].rel){r=t.link[l].href;break}i="content"in t?t.content.$t:"summary"in t?t.summary.$t:"",a="media$thumbnail"in t?t.media$thumbnail.url:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG4Ar0DwYTbd8rpGGn1MlTs1XzAe-wvRbA0Fi-NV4wWk0rPrWZnHwK281oPZziWvkUwilZFaRqk1jPdYwW1feUBe4v8nEIFhM7wsCTf5x-t58eWsahc9ZiIitkzeh0tHX4S6zgXTKTjFHG/s1600/no-image.png",s+="<div class='recentposarea'>",s+="<a href='"+r+"' target='_blank'><img src='"+a+"' /></a>",s+="<h6><a href='"+r+"'>"+n+"</a></h6>",s+="<p>"+arlinafeed(i,charac)+"...</p>",s+="</div>"}document.getElementById("borpbox").innerHTML=s,s="",s+=urlprevious?"<a href='javascript:navigasifeed(-1);' class='previous'>Previous</a>":"<span class='noactived previous'>Previous</span>",s+=urlnext?"<a href='javascript:navigasifeed(1);' class='next'>Next</a>":"<span class='noactived next'>Next</span>",s+="<a href='javascript:navigasifeed(0);' class='home'>Home</a>",document.getElementById("rpnavigation").innerHTML=s}function navigasifeed(e){var t,n;-1==e?(t=urlprevious.indexOf("?"),n=urlprevious.substring(t)):1==e?(t=urlnext.indexOf("?"),n=urlnext.substring(t)):n="?start-index=1&max-results="+numfeed+"&orderby=published&alt=json-in-script",n+="&callback=showrecentpostsae",incluirscript(n)}function incluirscript(e){1==startfeed&&removerscript(),document.getElementById("borpbox").innerHTML="<div id='loadrecentpost'></div>",document.getElementById("rpnavigation").innerHTML="";var t=urlblog+"/feeds/posts/default"+e,n=document.createElement("script");n.setAttribute("type","text/javascript"),n.setAttribute("src",t),n.setAttribute("id","arlinalabel"),document.getElementsByTagName("head")[0].appendChild(n),startfeed=1}function removerscript(){var e=document.getElementById("arlinalabel"),t=e.parentNode;t.removeChild(e)}onload=function(){navigasifeed(0)}; //]]></script><div id="borpbox"></div><div id="rpnavigation"></div>

غير هذا var urlblog = "https://modountiy.blogspot.com.eg
الى عنوان URL مدونتك

ثالثا :- اداه بسيطه وجميله ومتناسقه وبها صور مصغره

<style type="text/css">img.recent-post-thumbnail{float:right;height:50px;width:50px;margin:5px -5px 0px 0px;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;padding:3px;background: #fff} ul.recent-posts-wrap {background: #fff;list-style-type: none; margin: 5px 0px 5px 0px; padding: 0px;font:12px 'Ubuntu Condensed', sans-serif;} ul.recent-posts-wrap li:nth-child(1n+0) {background: #FCD092; width: 94%} ul.recent-posts-wrap li:nth-child(2n+0) {background: #FFE0B4; width: 94%} ul.recent-posts-wrap li:nth-child(3n+0) {background: #FFF59E; width: 94%;} ul.recent-posts-wrap li:nth-child(4n+0) {background: #E1EFA0; width: 94%;} ul.recent-posts-wrap li:nth-child(5n+0) {background: #B1DAEF; width: 94%;} ul.recent-posts-wrap li {padding:5px 10px;list-style-type: none; margin: 0 0 -5px; color: #777;} .recent-posts-wrap a { text-decoration:none; } .recent-posts-wrap a:hover { color: #222;} .post-date {color:#e0c0c6; font-size: 11px; } .recent-post-title a {font-size: 14px;font-weight: bold;color: #444;} .recent-post-title {padding: 6px 0px;} .recent-posts-details a{ color: #222;} .recent-posts-details {padding: 5px 0px 5px; } </style><script type="text/javascript">function showrpwiththumbs(t){document.write('<ul class="recent-posts-wrap">');for(var e=0;e<posts_number;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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGXYancVWEFnnSn2h1w4ZphA6nwZBQVtuu4vYH0UR9lIUcjD_WzQLN_MPK0D1TfA2ETSdDAQLs5r3xfyIkazXYrkG15NKG670Vx0w6elj6JNNuO5VeAPtL4UMgFhPrstIfeL9nZkkQguVO/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==showpostswiththumbs&&document.write('<a href="'+r+'"><img class="recent-post-thumbnail" 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==insidereadmorelink&&(1==$&&(_+=" | "),_=_+'<a href="'+r+'" class="url" target ="_top">Read more</a>',$=1),1==showcomments&&(1==$&&(_+=" <br> "),"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_number = 5; var showpostswiththumbs = true; var insidereadmorelink = true; var showcomments = false; var posts_date = true; var post_summary = true; var summary_chars = 70; </script><script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrpwiththumbs"></script><noscript>Your browser does not support JavaScript!</noscript><link href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed' rel='stylesheet' type='text/css' />

كل الاضافات مرنه وبسيطه يمكن ان تتحكم فى عدد العناوين التى تنشر - عدد حروف الملخص ـ شكل الصور المصغره وغيرها كثير وهذا سوف يكون موضوع تدوينه اخرى قادمه باذن الله ..

كيفية إضافة أداه آخر مشاركة في بلوجر؟

لقد قدمنا بعض الادوات للمشاركات الأخيرة . وقد تم اختبار كل من هذه الادوات.
نآمل أن تكون قد اخترت بالفعل نمطا لمدونتك. الآن دعونا نرى كيفية إضافة هذه الادوات إلى مدونتك:

* تسجيل الدخول إلى حساب مدونتك. حدد مدونتك وانتقل إلى لوحة التحكم

* من الشريط الجانبي الأيسر، انقر على قسم "تخطيط". يمكنك الآن العثور على الشريط الجانبي للمدونة والنقر على الرابط "إضافة أداة".

* بعد النقر على الرابط، سوف تظهر نافذة منبثقة جديدة أمامك. من قائمة الحاجيات، اختر "هتمل / جافا سكريبت". انقر على علامة "+" الزرقاء.

* وضع "المشاركات الأخيرة" في المربع اسم الاداه. ثم أ نسخ كود الاداه من اعلاه ثم أ لصقه في المربع كما هو مبين أدناه

* انقر على زر "حفظ". انتقل إلى مدونتك وأعد تحميلها. الاداه التي اخترتها تعمل

* لقد تم شرح خطوة بخطوة كيف يتم إضافة أداه المشاركات الأخيرة في مدونتك. آمل أن تكون قد أضفت الاداه المطلوبة بنجاح في مدونتك. إذا كنت مثل هذه المشاركة، مفيده يرجى إعطاء ملاحظاتك من خلال التعليق وعمل مشاركه .

ملاحظه تم الاعتماد على مقالات منشوره فى المواقع الاتيه

bloggersorigin.com

helplogger.blogspot.com

hackingdream.net

انصح بالدخول اليها للافاده والتوسع . . . . .

مدونه عامه ـ برامج ـ مواقع مفيده ـ رياضه ـ اسلاميات ـ العاب ـ احدث اخبار التكنولجيا

أصافه المشاركات الأخيرة لبلوجر ..1..

أحدث الأضافات

اهم الاقسام