>

إضافة أداة مواضيع عشوائيه لمدونة بلوجر - شرح كامل



بسم الله الرحمن الحريم
والصلاة والسلام على خير خلق الله , سيدنا محمد عليه الصلاة واتم التسليم
السلام عليكم ورحمة الله وبركاته .




إضافة اداة مواضيع عشوائيه لمدونة بلوجر 

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


مثال مباشر : من هنا 



صورة من الأداة : 





طريقة التركيب : 
  1. اذهب الى التخطيط .
  2. ثم إضافة اداة HTML/javascript .
  3. الصق هذا الكود داخلها : 









<style scoped="" type="text/css">
ul.rdmrcpostag{text-align:right;font:normal normal 11px Arial,Geneva,sans-serif}
ul.rdmrcpostag,ul.rdmrcpostag li{margin:0;padding:0;list-style:none;overflow:hidden}
ul.rdmrcpostag{background:aliceBlue}
ul.rdmrcpostag li{padding:5px;font: 12px tahoma,arial;}
ul.rdmrcpostag b a{color:#00699B}
ul.rdmrcpostag .thumbp{float:right;margin:0 0 3px 5px}
ul.rdmrcpostag img{padding:3px;border:1px solid #B1B1B1;background:#F3F3F3}
ul.rdmrcpostag .datex{font-size:8px;margin:3px 0 0}
ul.rdmrcpostag .dt{margin:0 0 0 5px;padding:0 0 0 5px;border-right:1px solid #7A7A7A;display:none;}
ul.rdmrcpostag p{margin:5px 0 0}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">function RandomRecenTag(b){(function(m){var j={blogURL:"",MaxPost:5,RandompostActive:true,idcontaint:"#randompost",thumbSize:100,jumlahhuruf:100,cmtext:"comments",pBlank:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiobObxMyXjp8h7T0V5G1Z4LcvKQqEPBirFrnPgIclddLwOKBapiT-uz7ceaHm32f5o4OrjrcBRJU8Xwt84fCBnkgyGij22-6je3ohlIFkRQfbcPFGxFciS6teHZIcIjyJ7PC5f1AcS8ZE/s1600/noimage.jpg",NoCmtext:"No Comment",tagName:false};j=m.extend({},j,b);var k=m(j.idcontaint);if(j.blogURL==""){var a=window.location.protocol+"//"+window.location.host}else{var a=j.blogURL}var o=k.append('<ul class="rdmrcpostag"/>');var l=function(y){var D,i,c,h,B,z,C,f="",A=y.feed.entry;for(var d=0;d<A.length;d++){for(var e=0;e<A[d].link.length;e++){if(A[d].link[e].rel=="alternate"){D=A[d].link[e].href;break}}for(var g=0;g<A[d].link.length;g++){if(A[d].link[g].rel=="replies"&&A[d].link[g].type=="text/html"){c=A[d].link[g].title.split(" ")[0];break}}if(c!=0){h='<span class="cm">'+c+" "+j.cmtext+"</span>"}else{h='<span class="cm">'+j.NoCmtext+"</span>"}if("content" in A[d]){B=A[d].content.$t}else{if("summary" in A[d]){B=A[d].summary.$t}else{B=""}}if("media$thumbnail" in A[d]){z=A[d].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+j.thumbSize+"-c")}else{z=j.pBlank.replace(/\/s[0-9]+(\-c|\/)/,"/s"+j.thumbSize+"$1")}B=B.replace(/<\S[^>]*>/g,"");if(B.length>j.jumlahhuruf){B=B.substring(0,j.jumlahhuruf)+"..."}i=A[d].title.$t;C=A[d].published.$t.substring(0,10),C=C.replace(/-/g,"/");f+='<li><a class="thumbp" href="'+D+'" target="_blank"><img width="'+j.thumbSize+'" height="'+j.thumbSize+'" alt="'+i+'"src="'+z+'"/></a><b><a href="'+D+'" target="_blank">'+i+'</a></b><div class="datex"><span class="dt">'+C+"</span>"+h+'</div><p class="contxisi">'+B+"</p></li>"}m("ul",k).append(f)};var p=function(h){Total_Posts_Number=h.feed.openSearch$totalResults.$t;if(Total_Posts_Number<=j.MaxPost){j.MaxPost=Total_Posts_Number}var e=[];while(e.length<j.MaxPost){var f=Math.ceil(Math.random()*Total_Posts_Number);var g=false;for(var i=0;i<e.length;i++){if(e[i]==f){g=true;break}}if(!g){e[e.length]=f}}if(j.tagName==false){var c=""}else{var c="/-/"+j.tagName}if(j.RandompostActive==true){for(var d=0;d<j.MaxPost;d++){m.ajax({url:a+"/feeds/posts/default"+c+"?start-index="+e[d]+"&max-results=1&orderby=published&alt=json-in-script",success:l,dataType:"jsonp",cache:true})}}else{m.ajax({url:a+"/feeds/posts/default"+c+"?max-results="+j.MaxPost+"&orderby=published&alt=json-in-script",success:l,dataType:"jsonp",cache:true})}};var n=function(){if(j.tagName==false){m.ajax({url:a+"/feeds/posts/default?max-results=0&alt=json-in-script",success:p,dataType:"jsonp",cache:true})}else{m.ajax({url:a+"/feeds/posts/default/-/"+j.tagName+"?max-results=0&alt=json-in-script",success:p,dataType:"jsonp",cache:true})}};m(document).ready(n)})(jQuery)};</script>
<a style='display: none;' href='http://infokelvin.com'></a>
<div id="randomcecent_posts_id">
</div>
<script type="text/javascript">
//<![CDATA[
$(window).load(function(){
RandomRecenTag({
blogURL: "http://infokelvin.com",
MaxPost: 6,
RandompostActive: true,
thumbSize:55,
jumlahhuruf:100,
cmtext:"تعليق",
NoCmtext:"لا يوجد تعليقات",
tagName:false,
idcontaint: "#randomcecent_posts_id"
});
});
//]]>
</script>

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