আসসালামুয়ালাইকুম

আশা করি সবাই ভালই আছেন ,

আজ আপনাদের আমি দিব Recent Post Slider. আশা করি আপনাদের ভালই লাগবে

সাধারনত যারা ব্লগিং করেন তারা তাদের ব্লগার এ যদি স্লাইড শোও যুক্ত করে থাকেন। কিন্তু ফল কি হয় যখন পোস্ট করেন তখন ওইটা বার বার আপডেট করতে হয়

তাই আজ আমি আপনাদের দিব এমন একটি স্লাইডার যা একবার যুক্ত করলে কোন দিন আপডেট করতে হবে না

চলুন কাজ শুরু করা যাক

প্রথমে আপ্নে আপনার ব্লগার এ প্রবেশ করুন তারপর

লেআউট এ গিয়ে Html/javascript ……Select করুন

তারপর নীচের কোড টি Copy paste করুন

<style>#slide-container {height: 360px;position: relative;width: 480px;}#slider {height: 360px;left: 25px;overflow-x: hidden;overflow-y: hidden;position: relative;width: 480px;font-family: calibri;}.slide-desc {background: transparent url(http://i195.photobucket.com/albums/z105/dantearaujo/darkbg.png) repeat scroll 0 0;color: #FFFFFF;padding: 10px;position: absolute;right: 0px;text-align: left;top: 0;width: 200px;z-index: 99999;}.slide-desc h2 {display: block;}.crosscol .widget-content {position: relative;}#slider ul, #slider li,#slider2 ul, #slider2 li {margin: 0;padding: 0;list-style: none;}#slider2 {margin-top: 1em;}#slider li, #slider2 li {/*define width and height of list item (slide)entire slider area will adjust according to the parameters provided here*/width: 480px;height: 360px;overflow: hidden;}#prevBtn, #nextBtn,#slider1next, #slider1prev {display: block;width: 30px;height: 77px;position: absolute;left: -30px;text-indent: -9999px;top: 71px;z-index: 1000;}#nextBtn, #slider1next {left: 520px !important;}#prevBtn, #nextBtn, #slider1next, #slider1prev {display: block;height: 77px;left: 0;position: absolute;top: 132px;width: 30px;z-index: 1000;}#prevBtn a, #nextBtn a,#slider1next a, #slider1prev a {display: block;position: relative;width: 30px;height: 77px;background: url(http://i195.photobucket.com/albums/z105/dantearaujo/prev.png) no-repeat 0 0;}#nextBtn a, #slider1next a {background: url(http://i195.photobucket.com/albums/z105/dantearaujo/next.png) no-repeat 0 0;}/* numeric controls */ol#controls {margin: 1em 0;padding: 0;height: 28px;}ol#controls li {margin: 0 10px 0 0;padding: 0;float: left;list-style: none;height: 28px;line-height: 28px;}ol#controls li a {float: left;height: 28px;line-height: 28px;border: 1px solid #ccc;background: #DAF3F8;color: #555;padding: 0 10px;text-decoration: none;}ol#controls li.current a {background: #5DC9E1;color: #fff;}ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus {outline: none;}</style>
<script src=’http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js’ type=’text/javascript’></script>
<script src=’http://accordion-template.googlecode.com/svn/trunk/easySlider1.7.js’ type=’text/javascript’></script>
<script type=’text/javascript’>
//<![CDATA[
$(document).ready(function(){
$("#slider").easySlider({
auto: true,
continuous: true
});
});
//]]>
</script>
<div id=”slider”>
<script style=”text/javascript” src=”http://code.helperblogger.com/easySlider.min.js”></script>
<script style=”text/javascript”>
var numposts_gal = 6; var numchars_gal = 150; var random_posts = false; // random posts
</script>
<script src=”http://filmlovers24.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showgalleryposts&max-results=999999″></script>
</div>

এইবার আপনার প্পছন্দ মত সব কিছু অ্যাডজাস্ট করে নিন

ধন্যবাদ

পুর্বে এই পোস্ট টী আমার ব্লগে প্রকাশিত হয় http://www.itcare24.tk