Page navigation widget for blogger is
extremely lovely widget to navigate blogspot
pages very easel and looking look in your Blog.
All navigation widgets is supported on
JavaScript.This code is very simple and easy to install in your Blog.
INSTALLATION:-
*Login To Your Blogger And Go To Design Section.
*Then Click On Edit/Html.
*Now search for </body> and place the below codes before it.
If You want to change No Of post in main page you can edit the code Search The Below extremely lovely widget to navigate blogspot
pages very easel and looking look in your Blog.
All navigation widgets is supported on
JavaScript.This code is very simple and easy to install in your Blog.
INSTALLATION:-
*Login To Your Blogger And Go To Design Section.
*Then Click On Edit/Html.
*Now search for </body> and place the below codes before it.
<style type="text/css">
.showpageArea{padding:10px;color : #003366;text-align : left;width : 100%;}
.showpage a {float:left;background:url(http://i1304.photobucket.com/albums/s526/aditya29best/th_Button_zps83307d9a.gif) 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(http://i1304.photobucket.com/albums/s526/aditya29best/th_pagenum_zpsef7ab18b.gif) 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(http://i1304.photobucket.com/albums/s526/aditya29best/pagenum1_zps325ab252.gif) no-repeat 0 100%;color : #fff;}
.showpagePoint {background : url(http://i1304.photobucket.com/albums/s526/aditya29best/pagenum2_zpsdcb52679.gif) 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://scriptjabbers.googlecode.com/files/Page%20Navigation.js"/>
Code and Do Modification in that.
#var pageCount=5; ~ Number of posts per page.
Now Save Your Template and See your blog. you have done it .
If any problem related to this widget Contact Via Comment We will Help you.
ConversionConversion EmoticonEmoticon