مثال مباشر : من هنا
طريقة التركيب :
- ادخل المدونة .
- التخطيط .
- اضف اداة HTML/javascript .
- الصق بها هذا الكود :
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></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/AVvXsEj_QWVI59XgeWefARFBzafGe2v0UfVUA7YSol9TQps_ySxBmPpNDOTD2lGbt_tzUB3RgDSMSetNYQqwECYAsWvsI0qMPZRwJaGpRnAB9ajzZOwOMvDPyf7Kf6PptegmX-LLC5rAMOEDqDY/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>
<div id="randomcecent_posts_id">
</div>
<script type="text/javascript">
//<![CDATA[
$(window).load(function(){
RandomRecenTag({
blogURL: "http://7lolblogger.com",
MaxPost: 6,
RandompostActive: true,
thumbSize:55,
jumlahhuruf:100,
cmtext:true,
NoCmtext:true,
tagName:'قوالب',
idcontaint: "#randomcecent_posts_id"
});
});
//]]>
</script>
<style>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: #fff;
width: 310px;
float: right;
}
ul.rdmrcpostag li {
padding: 5px;
float: right;
}
ul.rdmrcpostag b a {
color: #FFF;
font: 700 12px tahoma,'Open Sans',sans-serif;
margin-right: 80px;
padding: 13px 0 0 0;
height: 48px;
text-align: center;
border-radius: 4px;
display: block;
background: #F0BF4A;
border: 1px solid #D5A83D;
}
ul.rdmrcpostag b a:before {
content: "";
width: 0;
height: 0;
border-width: 10px 11px;
border-style: solid;
border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #F0BF4A;
position: relative;
top: 8px;
right: -22px;
display: block;
float: right;
}
ul.rdmrcpostag b a:hover {
color: #977014;
transition: .3s;
}
ul.rdmrcpostag .thumbp {
float: right;
margin: 0 0 3px 5px;
}
ul.rdmrcpostag img {
padding: 3px;
border: 1px solid #D5A83D;
background: #F0BF4A;
border-radius: 10px;
}
ul.rdmrcpostag .datex {
display: none;
}
ul.rdmrcpostag .dt {
margin: 0 0 0 5px;
padding: 0 0 0 5px;
border-right: 1px solid #7A7A7A;
display: none;
}
ul.rdmrcpostag p {
display: none;
}</style>
تخصيص الاضافة :
اللون الاحمر : استبدله بعنوان مدونتك .اللون الاصفر : هذا عدد المشاركات , تستطيع زيادته او انقاصه ( بمزاجك ) .
اللون الاخضر : هذا اسم التصنيف , قم بتغيره بالتصنيف الذي تريد , ولاكن اذا اردت اظهار المشاركات بطريقة عشوائيه فستبدله كامل مع علامات التنصيص بهذه false
اللون البنفسجي : هو كود استدعاء مكتبة الجيكوري , بدونه لن تعمل الأضافة , ولاكن هو موجود في معظم القوالب , اذا كان بالفعل موجود في مدونتك فحذفه لانك لست بحاجته .
إرسال تعليق