سلايد جديد على المدونة فى قسم السلايد شو هو سلايد شو فى أصداره الثانى بشكل جديد بعد عرض موضوع سلايد شو احترافى يعرض اخر المواضيع بشكل تلقائى وهذا السلايد يعرض اخر 4 مواضيع فى مدونتك بشكل تلقائى رائع وذلك سوف يسهل عليك كثيرا فى عرض مواضيع مدونتك ويمكنك معاينة السلايد من الرابط التالى نمر الأن لشرح التركيب على مدونتك .
معاينة السلايد
صور للسلايد
شرح التركيب
- قم بالبحث عن الوسم التى هذا]]></b:skin>ثم ضع فوقه الكود التالى .
.randompost{padding:1% 0}.randompost ul li{float:right;width:25%;padding:0;box-sizing:border-box;position:relative}.randomimg{overflow:hidden;background:#333;transition:all 1s ease;-moz-transition:all .8s ease;-ms-transition:all .8s ease;-webkit-transition:all .8s ease;-o-transition:all .8s ease}.randomimg:hover{background:#33b242}.randompost ul li:nth-child(1){height:420px;width:50%}.randompost ul li:nth-child(2){height:209.5px;width:50%}.randompost ul li:nth-child(1) .randomimg,.randompost ul li:nth-child(1) .rcp-thumb{height:420px}.randompost ul li:nth-child(1) .randomimg{margin-left:1px}.randompost ul li:nth-child(4) .randomimg{margin-top:1px}.randompost ul li:nth-child(3) .randomimg{margin-top:1px;margin-left:1px}.rcp-thumb{width:100%;height:209.5px;position:relative;display:block;overflow:hidden;opacity:.3!important;transition:all 1s ease;-moz-transition:all .8s ease;-ms-transition:all .8s ease;-webkit-transition:all .8s ease;-o-transition:all .8s ease;transform:scale(1.5);-moz-transform:scale(1.5);-webkit-transform:scale(1.5);-o-transform:scale(1.5);-ms-transform:scale(1.5);-webkit-filter:blur(3px);-moz-filter:blur(3px);-o-filter:blur(3px);-ms-filter:blur(3px);filter:blur(3px)}.columns:hover .rcp-thumb{transform:scale(1);-moz-transform:scale(1);-webkit-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);-webkit-filter:blur(1px);-moz-filter:blur(2px);-o-filter:blur(2px);-ms-filter:blur(2px);filter:blur(2px)}.rcp-thumb:after{content:no-close-quote;position:absolute;left:0;bottom:0;width:100%;height:135px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZETwEvaNJvoh_396unsCcDrQ5cCI3l7BUrqbObqohJWWmxKYBwPfvxlsfxoNjGyNtLJN5ctv0ioTTmiITh-5itw0_EE-kumPQKkKGNFAe0nGc1D8X923Ji6qaSd75WBoYwMVZtPz0rO0/s1600-r/metabg.png) repeat-x;opacity:.8;background-size:100% 100%;overflow:hidden}.featured-overlay{position:absolute;left:0;top:0;z-index:1;width:100%;height:100%;background-color:rgba(40,35,40,0.05)}.re-tag .tag{position:absolute;top:15px;right:15px;background-color:#243748;color:#fefefe;text-transform:uppercase;font-weight:400;z-index:5;height:25px;line-height:25px;padding:0 5px;font-size:11px}.post-panel{position:absolute;bottom:0;right:0;width:100%;padding:15px;z-index:2;box-sizing:border-box}h3.rcp-title{font-size:16px;position:relative;margin-bottom:8px}.rcp-title a{color:#fefefe;font-weight:500;position:relative;line-height:1.4em;text-shadow:0 1px 1px rgba(0,0,0,0.5)}.re-ps{font-size:12px;color:#ccc;font-weight:400}.re-ps .recent-date i{margin-left:5px}
- الأن قم بالبحث عن الوسم هذا</head>ثم ضع فوقه الكود التالى .
<script type='text/javascript'>
//<![CDATA[
function postbylabel(a){document.write("<ul class='labelposts'>");for(var b=0;b<a.feed.entry.length;b++){for(var c=a.feed.entry[b],d=0;d<c.link.length;d++)if("alternate"==c.link[d].rel){var e=c.link[d].href;break}var f=c.title.$t,g=c.category[0].term,h=c.author[0].name.$t,j=c.content.$t,k=c.published.$t,l=k.substring(0,4),m=k.substring(5,7),n=k.substring(8,10),o=[,"يناير ","فبراير ","مارس ","أبريل ","مايو ","يونيو ","يوليو ","أغسطس ","سبتمبر ","أكتوبر ","نوفمبر ","ديسمبر "],p=n+" "+o[parseInt(m,10)]+" "+l,q=0;c<h.link.length,q++,i=j.replace(/<.+?>/g,"").substring(0,120)+"...",img=c.media$thumbnail.url.replace("s72-c","s900-c").replace("default","hqdefault"),document.write("<li class='columnl'><div class='maincon'><div class='mainimg'><a class='imag' href="+e+" style='background:url("+img+")no-repeat center center;background-size: cover'></a><span class='forever'></span></div><div class='cont'><span class='tag'><a>"+g+"</a></span><h3 class='titlelab'><a href="+e+">"+f+"</a></h3><div class='autre'><span class='author'><i class='fa fa-user-circle'></i>"+h+"</span><span class='times'><i class='fa fa-clock-o'></i>"+p+"</span><p class='psummary'>"+i+"></p></div></div></li>")}document.write("</ul>")}function related_results_labels_thumbs(e){for(var f=0;f<e.feed.entry.length;f++){var g=e.feed.entry[f];relatedTitles[relatedTitlesNum]=g.title.$t;try{thumburl[relatedTitlesNum]=g.media$thumbnail.url}catch(e){s=g.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),a!=-1&&b!=-1&&c!=-1&&""!=d?thumburl[relatedTitlesNum]=d:"undefined"!=typeof defaultnoimage?thumburl[relatedTitlesNum]=defaultnoimage:thumburl[relatedTitlesNum]="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhos_HOHJ0s1D7nGuk-jhsLKvG-lH3cGVBFPHpcSSkwfiicw2p3wU8rtC-zzPkUiIj6Ll5xylw8WrhKwIusoxkHPt3_SOluQM5_VB5-FRUMcBXXjqJSvTOdVbM0cIArrGfc3KAjqbo-Unw/s400/noimage.png"}relatedTitles[relatedTitlesNum].length>35&&(relatedTitles[relatedTitlesNum]=relatedTitles[relatedTitlesNum].substring(0,90)+"");for(var h=0;h<g.link.length;h++)"alternate"==g.link[h].rel&&(relatedUrls[relatedTitlesNum]=g.link[h].href,relatedTitlesNum++)}}function removeRelatedDuplicates_thumbs(){for(var a=new Array(0),b=new Array(0),c=new Array(0),d=0;d<relatedUrls.length;d++)contains_thumbs(a,relatedUrls[d])||(a.length+=1,a[a.length-1]=relatedUrls[d],b.length+=1,c.length+=1,b[b.length-1]=relatedTitles[d],c[c.length-1]=thumburl[d]);relatedTitles=b,relatedUrls=a,thumburl=c}function contains_thumbs(a,b){for(var c=0;c<a.length;c++)if(a[c]==b)return!0;return!1}function printRelatedLabels_thumbs(a){var b;b="undefined"!=typeof splittercolor?splittercolor:"#d4eaf2";for(var c=0;c<relatedUrls.length;c++)relatedUrls[c]!=a&&relatedTitles[c]||(relatedUrls.splice(c,1),relatedTitles.splice(c,1),thumburl.splice(c,1),c--);var d=Math.floor((relatedTitles.length-1)*Math.random()),c=0;for(relatedTitles.length>0&&document.write('<ul id="related-posts">');c<relatedTitles.length&&c<20&&c<maxresults;)document.write('<li><div class="relaimg"><a'),document.write(' href="'+relatedUrls[d]+'"><img src="'+thumburl[d]+'"/></a></div><a'),document.write(' href="'+relatedUrls[d]+'"><div class="overlay">'+relatedTitles[d]+"</div></a></li>"),c++,d<relatedTitles.length-1?d++:d=0;document.write("</ul>"),relatedUrls.splice(0,relatedUrls.length),thumburl.splice(0,thumburl.length),relatedTitles.splice(0,relatedTitles.length)}function recentComments(a){var b=a.feed.entry.length>3?3:a.feed.entry.length;comments="<ul class='recentComments recent'>";for(var c=0;c<b;c++){var d="";try{d="<img src='"+a.feed.entry[c].author[0].gd$image.src.replace(/\/s[0-9]+(-*c*)\//,"/s70$1/")+"'/>"}catch(a){d="<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3Z3WOcfhxTtq6rSx5Ee6X5rYreCQrSJoUNjAHtF7YxOp5gy6LLz93h4woY6K8sGSH-Skd93H35r_5z82HlwyV4gU7mu0VITgSh8BJ6k7cUpLIZ2UfKtt6L9Chpc0bnOARhwAIWWhWNimR/s1600-r/th.jpg'/>"}var e=a.feed.entry[c].link[2].href,f=a.feed.entry[c].content.$t.replace(/<.*?>/gi,"").split(/\s+/).slice(0,9).join(" ")+"...",g=a.feed.entry[c].published.$t,h=a.feed.entry[c].author[0].name.$t;g=t(g),comments+="<li><a href='"+e+"'> <div class='commentImg recentImg'>"+d+"</div><div class='commentCon recentCon'><div class='authorName recentTitle'>"+h+"</div><div class='commentSnippet'>"+f+"</div><div class='commentTime recentTime'><span>"+g+"</span></div></div></a></li>"}comments+="</ul>"}function printRecentComments(){document.write(comments)}function t(a){var b=a.substr(0,4),c=months[Number(a.substring(5,7))-1],d=Number(a.substring(8,10)),e=d+" "+c+" "+b;return e}function recentPosts(a){recentPostsV="<ul class='recentPosts recent'>";var b=3;b=a.feed.entry.length>3?3:a.feed.entry.length;for(var c=0;c<b;c++){var d="";try{d="<img src='"+a.feed.entry[c].media$thumbnail.url.replace(/\/s[0-9]+(-*c*)\//,"/s70$1/")+"' />"}catch(a){d="<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3Z3WOcfhxTtq6rSx5Ee6X5rYreCQrSJoUNjAHtF7YxOp5gy6LLz93h4woY6K8sGSH-Skd93H35r_5z82HlwyV4gU7mu0VITgSh8BJ6k7cUpLIZ2UfKtt6L9Chpc0bnOARhwAIWWhWNimR/s1600-r/th.jpg'/>"}var e=t(a.feed.entry[c].published.$t),f=a.feed.entry[c].title.$t,g=a.feed.entry[c].link[a.feed.entry[c].link.length-1].href;recentPostsV+="<li><div class='recentPostImg recentImg'>"+d+"</div><div class='recentCon'><div class='recentPostTitle recentTitle truncate'><a href='"+g+"'>"+f+"</a></div><div class='recentPostTime recentTime'><span>"+e+"</span></div></div></li>"}recentPostsV+="</ul>"}function printRecentPosts(){document.write(recentPostsV)}$(document).ready(function(){$(".widget-content").each(function(){var a=$(this).text();a.match("random-posts")&&$.ajax({url:"/feeds/posts/default?alt=json-in-script",type:"get",dataType:"jsonp",success:function(a){var b=a.feed.entry.length,c=0,e=b-5,g=Math.floor(Math.random()*(e-c+1))+c;$.ajax({url:"/feeds/posts/default?alt=json-in-script&start-index="+g+"&max-results=4",type:"get",dataType:"jsonp",success:function(a){for(var b="",c='<ul class="post-widget">',e=0;e<a.feed.entry.length;e++){for(var g=0;g<a.feed.entry[e].link.length;g++)if("alternate"==a.feed.entry[e].link[g].rel){b=a.feed.entry[e].link[g].href;break}var h=a.feed.entry[e].title.$t,i=a.feed.entry[e].author[0].name.$t,j=a.feed.entry[0].published.$t,k=j.substring(0,4),g=j.substring(5,7),m=j.substring(8,10),n=[,"يناير ","فبراير ","مارس ","أبريل ","مايو ","يونيو ","يوليو ","أغسطس ","سبتمبر ","أكتوبر ","نوفمبر ","ديسمبر "],o=m+" "+n[parseInt(g,10)]+" "+k,p=0;if(b<i.link.length,p++,l=a.feed.entry[e].category[0].term,d=$("<div>").html(l),f=d.find("img:first").attr("src"),m=a.feed.entry[e].media$thumbnail.url,void 0===f)var k='<div class="randomimg"><a class="rcp-thumb" href="'+b+'" style="background:url('+m+') no-repeat center center;background-size: cover"><span class="featured-overlay"></span></a></div>';else var k='<a class="rcp-thumb" href="'+f+'"><img src="'+f+'"/></a>';c+="<li class='columns'>"+k+'<div class="re-tag"><span class="tag">'+l+'</span></div><div class="post-panel"><h3 class="rcp-title"><a href="'+b+'">'+h+'</a></h3><div class="re-ps"><span class="recent-date"><i class="fa fa-clock-o"></i>'+o+"</span></div></div></li>"}c+='</ul><div class="clear"/>',$(".widget-content").each(function(){$(this).text().match("random-posts")&&($(this).html(c),$(this).find("a.rcp-thumb").each(function(){$(this).attr("style",function(a,b){return b.replace("/default.jpg","/mqdefault.jpg")}).attr("style",function(a,b){return b.replace("s72-c","s1000")})}))})}})}})})});var relatedTitles=new Array,relatedTitlesNum=0,relatedUrls=new Array,thumburl=new Array;$(document).ready(function(){$("#related-posts img").attr("src",function(a,b){return b.replace("s72","s640")}),$("#related-posts img").attr("src",function(a,b){return b.replace("/default.jpg","/mqdefault.jpg")})});var months=["يناير","فبراير","مارس","أبريل","مايو","يونيو"," يوليو"," أغسطس","سبتمبر","أكتوبر","نوفمبر"," ديسمبر"];
//]]>
</script>
- الأن مع اخر كود وهو الذى سوف يعمل على ظهور السلايد
- تقوم بوضعه كما تريد فى مدونتك وبالمكان الذى تريدها
- ويمكنك وضعه فو هذا الوسمpost-wrapperليكون فوق المواضيع فى مدونتك
- وفى قوالب اخر سوف تجد الوسم هكذاmain-wrapper
- عليك وضع فوق احد هذه الأوسام او كما تريدها
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<div class='randompost'>
<div class='section' id='rpost'>
<div class='widget-content'>
random-posts
</div>
</div>
</div>
</b:if>
</b:if>
- الأن عليك حفظ القالب ومبروك عليك السلايد الجديد