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

1
415

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

আশা করি সবাই ভালই আছেন , অন্নেক দিন টেকটিউনে লিখ তে বসলাম……

Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting

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

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

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

content slider আপনার ব্লগে যুক্ত করুন 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(https://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(https://i195.photobucket.com/albums/z105/dantearaujo/prev.png) no-repeat 0 0;}#nextBtn a, #slider1next a {background: url(https://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 = 6var 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

টিউনারপেজের নতুন টিউন আপনাকে ইমেইল করব?
Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting

1 মন্তব্য

  1. আমি আমার ব্লগে একটি নিজউ স্লাইড শো দিতে চাচ্ছি, যাতে প্রতিটি নিউজে ক্লিক করলে একটি আলাদা পেজ খুলবে এবং ফুল নিউজ দেখাবে…. আমাকে কি একটু এ বিষয়ে হেল্প করবেন?
    আমার ব্লগ সাইট: mdsadibd.blogspot.com

একটি উত্তর ত্যাগ

Please enter your comment!
Please enter your name here

fifteen + eleven =