سلايد شو احترافى يعرض اخر المواضيع بشكل تلقائى الأصدار الثانى

هذا السلايد يعرض اخر 4 مواضيع فى مدونتك بشكل تلقائى و رائع وذلك سوف يسهل عليك كثيرا فى عرض مواضيع مدونتك ويمكنك معاينة السلايد من الرابط التالى نمر الأن لشرح التركيب على مدونتك .

معاينة السلايد

اضغط هنا

شرح التركيب

• قم بالبحث عن الوسم التى هذا " ]]></b:skin>  " ثم ضع فوقه الكود التالى .

css

.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/AVvXsEh0DZLMXsla8-fLYXspHplMFXXsPrWJopRAFAKrIdunqS4zi2XRIZ3hisrziwR5vHyYN_cD7gvdO5plJ8csnAU-XfzirRd33wIPUNYSUn6eN1sS0GUXRMtwuH0Df485OXG234aS1LH6NGY/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}

• الأن مع اخر كود وهو الذى سوف يعمل على ظهور السلايد 
•  تقوم بوضعه كما تريد فى مدونتك و بالمكان الذى تريدها
• ويمكنك وضعه فو هذا الوسم post-wrapper ليكون فوق المواضيع فى مدونتك
•  وفى قوالب اخر سوف تجد الوسم هكذا main-wrapper 
• عليك وضع فوق احد هذه الأوسام او كما تريدها

HTML

<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>

• الأن عليك حفظ القالب ومبروك عليك السلايد الجديد

وهكذا كان موضوع اليوم بالتوفيق للجميع فى أمان الله

شارك الموضوع