আপনার ব্লগে যুক্ত করুন Recent Post Slider

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

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

দিন টেকটিউনে লিখ তে বসলাম……

আজ আপনাদের আমে দিব Recent Post

Slider. আশা করি আপনাদের ভালই

লাগবে

সাধারনত যারা ব্লগিং করেন তারা

তাদের ব্লগার এ যদি স্লাইড শোও যুক্ত

করে থাকেন। কিন্তু ফল কি হয় যখন পোস্ট

করেন তখন ওইটা বার বার আপডেট করতে

হয়

তাই আজ আমি আপনাদের দিব এমন একটি

স্লাইডার যা একবার যুক্ত করলে কোন

দিন আপডেট করতে হবে না

content slider 500x341 আপনার ব্লগে যুক্ত

করুন 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://banglakid.blogspot.com/

feeds/posts/default?

orderby=published&alt=json-in-

script&callback=showgalleryposts&max-

results=999999″></script>

</div>





এইবার আপনার প্পছন্দ মত সব কিছু

অ্যাডজাস্ট করে নিন

ধন্যবাদ