أسهل طريقة لإضافة سلايدشو إحترافي الإصدار الثاني يقوم بعرض مواضيع المدونه تلقائيا

Monday, August 28, 2017

أسهل طريقة لإضافة سلايدشو إحترافي الإصدار الثاني يقوم بعرض مواضيع المدونه تلقائيا

عشاق منصة بلوجر هم كثر و في كل مرة يبحثون عن أشياء جديدة لطرحها على مواقعهم و مدوناتهم و في درس اليوم سأعطيكم إضافة يبحث عنها تقريبا كل عشاق بلوجر ، الا و هي سلايد شو تلقائي و إحترافي يمكن إضافته إلى جميع مدونات بلوجر ، و لكن تابع الموضوع جيدا لتتلعم تركيبها بإحترافية .


في البداية يمكنك معاينة السلايد شو على الموقع التالي :

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

أولا قم بتحرير القالب ثم Ctrl+f و ابحث عن وسم ]]></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/AVvXsEjmOaxS47G-fDohKMBRESWNTXG9-dUKkPjP1XnSMTl3b-QI8vBPtsONBTdM6fKhVa4Vw9xN4-oqGmLWnjEnbsd1ezJ0e6xDdovrlaxG_tjNgEO_Tei1WmutOf1IL0fQudUM0jS17NOSoDg/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> او /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/AVvXsEhotteagTX9QwVIgBnOUN2Qq5-XBXQePIXRK2L7Hru77_4Va6PxipUO69_w754QFL3NDWFib3XoMdaKWxJay8y2v3DdkTJDPrZnIvlfTQojk8DiwxuaJ5ahe19aEUpLEDsi39lPbb0sq28/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/AVvXsEgA6D3dWQ4cqyg8p_Ipi8fIznlaz9DCsLbZ4IsPSDOC2axsF5lNsDAd8_Czfqk1yYcjvfKVMpBE-9dqUzKBjbntvpg2pdkq4YcNOLsKscdFpNYmmegcs2ovts6qnBv05kf-uGGsBQN_ShYB/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/AVvXsEgA6D3dWQ4cqyg8p_Ipi8fIznlaz9DCsLbZ4IsPSDOC2axsF5lNsDAd8_Czfqk1yYcjvfKVMpBE-9dqUzKBjbntvpg2pdkq4YcNOLsKscdFpNYmmegcs2ovts6qnBv05kf-uGGsBQN_ShYB/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>

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

لذا يمكنك تجربة وضع قبل وسم main-wrapper او post-wrapper و شوف النتيجة
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div class='randompost'>
<div class='section' id='rpost'>
<div class='widget-content'>
random-posts
</div>
</div>
</div>
</b:if>
</b:if>
الاَن احفظ القالب و شاهد النتيجة .

ملاحظات :

اذا كان قالب الذي حملته يحوي على سلايد شو و هو متوقف و لا يظهر مثلا بسبب ازالة حقوق المصمم فهنا يجب عليك ازالة كافة سكربتات  السلايد القديم و css الخاص به و عادة ابحث في القالب عن وسم Carousel او owlcarousel و قم بجذف كامل السكربت الشبيه بالذي اضفناه في الاعلى و نفس الشيء بالنسبة ل css الذي وضعناه قبل b:skin قم بجذفها و استبدالها .
تأكد  ايضا من وجود كلمة random في صندوق inrto-sec من التخطيط

Post a Comment

مساحة إعلانية
مساحة إعلانية

يمكنك مشاركة الموضوع على الواتساب من هاتفك المحمول فقط

اكتب كلمة البحث واضغط إنتري