Slide Recent Post Without Edit HTML

Salam blogger, ada yang sudah tau widget recent post slider. widget ini berbentuk unik bisa untuk mempercantik blog kita, dengan tampilan slider blog kita lebih terlihat atraktif loh. mau coba?
Tags: recent post keren, widget recent post slider, cara membuat recent post yang bagus keren dan cool.
Berikut ini Widget Recent Post Tanpa edit HTML yang keren sekali untuk anda pasang di sidebar blog:

 <style scoped="" type="text/css"> /*trickstoo modified widget of abt slider widget*/ ul.abt-sidebar-slider *{ -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; } ul.abt-sidebar-slider{ font:normal normal 11px embria } ul.abt-sidebar-slider,ul.abt-sidebar-slider li{ margin:0; padding:0; list-style:none; position:relative } ul.abt-sidebar-slider{ width:100%; height:500px } ul.abt-sidebar-slider li{ height:24.5%; position:absolute; padding:0; width:49.5%; float:left; overflow:hidden; display:none } ul.abt-sidebar-slider li:nth-child(1),ul.abt-sidebar-slider li:nth-child(2),ul.abt-sidebar-slider li:nth-child(3),ul.abt-sidebar-slider li:nth-child(4){ display:block } ul.abt-sidebar-slider img{ border:0; width:100%; height:100%} ul.abt-sidebar-slider li:nth-child(1){width:100%; height:49.5%; margin:0 0 2px; left:0;top:0 } ul.abt-sidebar-slider li:nth-child(2){left:0;top:50%} ul.abt-sidebar-slider li:nth-child(3){left:50.5%;top:50%} ul.abt-sidebar-slider li:nth-child(4){width:100%;left:0;top:75%} ul.abt-sidebar-slider .overlayx,ul.abt-sidebar-slider li{ -webkit-transition:all .4s ease-in-out; -moz-transition:all .4s ease-in-out; -o-transition:all .4s ease-in-out; -ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out } ul.abt-sidebar-slider .overlayx{ width:100%; height:100%; position:absolute; z-index:2; left:0; top:0; background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6bortoXbcY6gOT6s32wD1mbYAyniqGxPyaPkWGxARix7k59-ynCTHvzaVZBXRc0CTd1FVIDp_qO_LInmeiwqzz139ElMrgF0cpJg5-aDzLlneOsuQi9vGaXPg36Q3l7MmZwdtURB0eqE/s1600/linebg-fade.png); background-position:50% 50%; background-repeat:repeat-x } ul.abt-sidebar-slider .overlayx,ul.abt-sidebar-slider img{ border:4px solid black; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px } ul.abt-sidebar-slider li:nth-child(1) .overlayx{ background-position:50% 25% } ul.abt-sidebar-slider .overlayx:hover{ -ms-filter:"progid:DXImageTransform.Microsoft. Alpha(Opacity=10)"; filter:alpha(opacity=10);-khtml-opacity:0.1; -moz-opacity:0.1;opacity:0.1 } ul.abt-sidebar-slider h4{ position:absolute; bottom:30px; z-index:2; color:white; margin:0; width:100%; padding:0 10px; line-height:1.5em; font:embria; font-weight:normal } ul.abt-sidebar-slider li:nth-child(1) h4,ul.abt-sidebar-slider li:nth-child(4) h4{ font-size:150% } ul.abt-sidebar-slider .label_text{ position:absolute; bottom:10px; left:10px; z-index:2; color:white; font-size:90%} ul.abt-sidebar-slider li:nth-child(2) .autname,ul.abt-sidebar-slider li:nth-child(3) .autname{ display:none } .buttons{ margin:5px 0 0 } .buttons a{ display:inline-block; text-indent:-9999px; width:15px; height:25px; position:relative } .buttons a::before{ content:""; width:0; height:0; border-width:8px 7px; border-style:solid; border-color:transparent #535353 transparent transparent; position:absolute; top:50%; margin-top:-8px;margin-left:-10px; left:50% } .buttons a.nextx::before{ border-color:transparent transparent transparent #535353; margin-left:-3px } </style> <div id="featuredpostside"></div> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script> <script src="https://trickstoo-slider-recent-posts.googlecode.com/svn/trickstoo-slider.js" type="text/javascript"></script> <script type='text/javascript'> //<![CDATA[ FeaturedPostSide({ blogURL:"http://Your Link Web", MaxPost:10, idcontaint:"#featuredpostside", ImageSize:300, interval:6000, autoplay:true, tagName:false }); //]]> </script> 

Copy semua kode diatas, Dan silahkan anda edit Your link web sesuai dengan alamat blog anda:
apabila di template anda terdapat Jquery 1.8.0.Js maka silahkan anda hapus Script yang berwarna merah. Interval waktu 6000 bisa anda ubah sesuai dengan keinginan anda semakin kecil maka slidenya akan semakin cepat