ভালো ব্লগে সাইটে গেলে দেখা যায় প্রতিটা পেজের নিচে খুব সুন্দর পেজ নাম্বার থাকে তখন দেখে মনে হয় এগুলো আমিও যোগ করবো।আর সাধারনত ব্লগের নাম্বার থাকে না সেখানে পরের পেজ এবং আগের পেজ থাকে মানে Next এবং Previous post থাকে।
এখন আপনি চাইলে সুন্দর পেজ নাম্বার যোগ করতে পারেন।এটা দেখতে আসলেই খুব সুন্দর।এটা যোগ করার সাথে সাথে আপনার ব্লগের নিচে Next,Previous,Home এগুলো থাকবে না সেখানে নাম্বার যোগ হবে।
কিভাবে যোগ করবেনঃ
- প্রথমে ব্লগে প্রবেশ করুন।
- Template এ যান।
- Edit Template এ ক্লিক করুন।
- এবার ]]></b:skin> এইটুকু খুজুন এবং নিচের কোডগুলো এর উপরে বসিয়ে দিন।
.showpageNum a {এবার সেভ না করে </body> ট্যাগটি খুজুন এবং নিচের কোডটূকু এর উপরে বসিয়ে দিন।
background: #02ab68;
padding: 5px;
padding-left: 10px;
border: 1px solid #b9b9b9;
padding-right: 10px;
margin-right: 5px;
color: #000;
font-weight: bold;
}
.showpage a {
background: #02ab68;
padding: 5px;
padding-left: 10px;
border: 1px solid #b9b9b9;
padding-right: 10px;
margin-right: 5px;
color: #000;
font-weight: bold;
}
.showpageArea {
float: left;
}
.feed-links {
display: none;
}
.showpageArea a {
float: left;
font-size: 15px;
color: #fff!important;
padding-left: 15px;
padding-right: 15px;
}
.showpagePoint {
float: left;
font-size: 15px;
padding-left: 15px;
padding-right: 15px;
}
.showpageArea a {
text-decoration: none;
}
.showpageArea {
float: left;
width: 363px;
margin-top: 10px;
}
<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>
var pageCount=6;
var displayPageNum=6;
var upPageWord ='Previous';
var downPageWord ='Next';
</script>
<script src='http://widcraft.googlecode.com/svn/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if>
</b:if>
<!--Page Navigation Ends -->
এবার সেভ করুন।এবার আপনি সফল ভাবে নাম্বার যোগ করতে পেরেছেন।আপনার ব্লগে যান এবং হয়েছে কি না?
এখানে পরিবর্তন করবেন কিভাবে।
প্রতিটা পেজের পাশে মোট পেজ সংখ্যা দেখা যায় যদি মনে করেন আপনি মোট পেজ সংখ্যা দেখাবেন না তাহলে নিচের কোড টুকু উপরের সিএসএস কোডের মধ্যে পেস্ট করে দেন।
.showpageOf {কালার পরিবর্তন করতে ব্যাকগ্রাউন্ড কালার এবং কালার কোড পরিবর্তন করে দেন।
display: none;
}
আশা করি কাজে লাগবে,ভালো থাকবেন কোন সমস্যা হলে কমেন্ট করবেন।
0 মন্তব্য:
Post a Comment
এখন থেকে মন্তব্যে ছবি যোগ করতে পারেন।তবে অবশ্যই সেটি ভালো মানের ছবি হতে হবে অন্যথায় মন্তব্যটি মুছে ফেলা হবে এবং মন্তব্যটি অবশ্যই লেখার সাথে সম্পৃক্ত হতে হবে।