One of the important features of a good blog or site is that it is very easy for the blog visitors to navigate throughout the site. A site which is structured in such a way that the visitors have to take efforts to move from one page to another is seen as a poorly designed site.
Having proper navigation is important as it also helps to increase the page views for your blog. Blogger users are aware of the Newer Posts and Older Posts links at the bottom of the blog.
How To Install This Widget On Blogger?
1. Go To Blogger.com > Design > Edit Html
2. Press Ctrl+F & Find The Code Below
</body>3. Copy the code below and paste it just after </body> tag and save your template.
<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/AVvXsEgQGjZX29VfxbcxiQtSoO1taCdG93QMpPWueT7e_RwIoY-gufYsAvuePBpffwJCZQpIAM2ySQ4ph79JezB0jDl5OPcLXh5EDAreCi1FuhpNsVnBh0oWgRdPIUX6VxK3NhFLopaq2pZI5Kp4/) 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/AVvXsEiQaQUVoq68uF3Cy3gDMJp0jBTL9CtvVkp16IYQUybGqdyvT_VxEBlRM97QEvderEpGRyS7THFSYdnnlK4FIfHGqQhmsU17_8gS_kQsM_6zpHu0gLwqJVrFXjJse6hnJBmFaC1hBHWXJUsc/) 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/AVvXsEiQaQUVoq68uF3Cy3gDMJp0jBTL9CtvVkp16IYQUybGqdyvT_VxEBlRM97QEvderEpGRyS7THFSYdnnlK4FIfHGqQhmsU17_8gS_kQsM_6zpHu0gLwqJVrFXjJse6hnJBmFaC1hBHWXJUsc/) no-repeat 0 100%;color : #fff;}
.showpagePoint {background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQaQUVoq68uF3Cy3gDMJp0jBTL9CtvVkp16IYQUybGqdyvT_VxEBlRM97QEvderEpGRyS7THFSYdnnlK4FIfHGqQhmsU17_8gS_kQsM_6zpHu0gLwqJVrFXjJse6hnJBmFaC1hBHWXJUsc/) 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://bloggerblogwidgets.googlecode.com/files/BeautifulPageNavi.js"/>
0 comments:
Post a Comment