ဘေလာ့ဂါအတြက္ Page Number (Page Navigation) ျပဳလုပ္နည္း

ဘေလာ့ဂါအတြက္ Page Number ျပဳလုပ္လိုေသာပုဂၢိဳလ္မ်ားအေနနဲ႔ code မ်ားကိုတင္ေပးလိုက္တယ္။
စတိုင္လ္ (၂)မ်ိဳးတင္ေပးလိုက္တယ္။ Page Number ဆိုတာဘာလဲမသိေသးရင္ က်ေနာ္ဘေလာ့ေအာက္
ေျခကို ၾကည့္လိုက္ပါ။ ေအာက္ေျခကေတြ႕ရတဲ့ စာမ်က္ႏွာနံပါတ္ေလးေတြပါပဲ။ တစ္ျခားစတိုင္လ္ေတြအ
မ်ားၾကီးရွိပါတယ္။ က်ေနာ္က ဒီစတိုင္လ္ႏွစ္ခုကိုပဲအသံုးျပဳတာမ်ားေတာ့ ဒါနဲ႔ပဲတင္ေပးလိုက္တယ္။

ပထမစတိုင္လ္

အဆင့္(၁)
အရင္ Blogger Log in ၀င္ပါ။ ထိုေနာက္ Blogger Dashboard - Template - Edit HTML ကိုႏွိပ္ပါ။
ထိုေနာက္ ေအာက္က ]]></b:skin>ကိုရွာပါ။
ျပီးလွ်င္ ေအာက္ပါ ကုဒ္ေတြကို ေကာ္ပီကူးျပီ ]]></b:skin> ေပၚမွာ
ထည့္လိုက္ပါ။

.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}

အဆင့္ (၂)
</body>ကုဒ္ကို ရွာပါ။
ေတြ႕လွ်င္ ေအာက္ပါကုဒ္မ်ားကိုေကာ္ပီကူးျပီး ၎ </body> အထက္မွာထည့္ပါ။

<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord ='Previous';
var downPageWord ='Next';
</script>
<script src='http://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if>
</b:if>
<!--Page Navigation Ends -->

အားလံုးျပီးလွ်င္ Template ကို Save လုပ္ပါ။

အဆင္ေျပပါေစ....

ဒုတိယစတိုင္လ္

</body>ကုဒ္ကို ရွာပါ။ ေတြ႕လွ်င္ ေအာက္ပါကုဒ္မ်ားကိုေကာ္ပီကူးျပီး ၎ </body> အထက္မွာထည့္ပါ။

<style type="text/css">
    .showpageArea{padding:10px;color : #003366;text-align : left;width : 100%;}
    .showpage a {float:left;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoL26jSXJfk34oqXTBw_oDFw7YrBBC2AL-D2PxZpP-2U42nR24QuaLGtuG9wRtzLoP5hWVvm-2OX56elqLGsIU3-0ghI7uTCTvEHH2eLivBE2rQWlcTpKvj8L96zklGkm0TdpDz24A-NxP/) no-repeat 0 0;text-align : center;width : 127px;height : 42px;text-align : center;display : block;margin : 0 5px;color : #333;padding-top : 6px;}
    .showpage a:hover {color : #333;margin : 0 5px;padding-top : 6px;}
    .showpageOf{float:left;padding-top : 6px;}
    .showpageNum a {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEsxAC3GVgdpBXHQ5MfXqK8PZXYEBHC4RYYjInM7Lsl06cOvyWx_Fy6yoVwsppDj1-_tg6XdWjQcIzKS1OYUBFnUgx6Np3O6blqIz30ehUPVhZx0BxZ8MOLRmQGai7tz1lYG85z8GGHgTZ/) no-repeat 0 0;width : 37px;height : 42px;display : block;text-align : center;float : left;margin : 0 5px;padding-top : 6px;text-decoration : none;color : #333;}
    .showpageNum a:hover {background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEsxAC3GVgdpBXHQ5MfXqK8PZXYEBHC4RYYjInM7Lsl06cOvyWx_Fy6yoVwsppDj1-_tg6XdWjQcIzKS1OYUBFnUgx6Np3O6blqIz30ehUPVhZx0BxZ8MOLRmQGai7tz1lYG85z8GGHgTZ/) no-repeat 0 100%;color : #fff;}
    .showpagePoint {background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEsxAC3GVgdpBXHQ5MfXqK8PZXYEBHC4RYYjInM7Lsl06cOvyWx_Fy6yoVwsppDj1-_tg6XdWjQcIzKS1OYUBFnUgx6Np3O6blqIz30ehUPVhZx0BxZ8MOLRmQGai7tz1lYG85z8GGHgTZ/) no-repeat 0 100%;width : 37px;height : 42px;display : block;float : left;text-align : center;margin : 0 5px;padding-top : 6px;font-weight : bold;color : #fff;}
    .showpageNum a:link, .showpage a:link {text-decoration : none;color : #cc0000;}
</style>
<script style='text/javascript'>
var pageCount=5;
var displayPageNum=1;
var upPageWord="Previous";
var downPageWord="Next";
</script>
<script type='text/javascript' src="http://widgets.way2blogging.org/blogger-widgets/w2b-beautiful-pagenavi.js"/> 
 

ျပီးလွ်င္ Template ကို Save လုပ္ပါ။

အဆင္ေျပပါေစ....
ေစာလင္းနက္စ္