ADD PAGE NUMBERED NAVIGATION FOR BLOGGER

If you are a webmaster, this is a must gadget for your blog, Make your blog familiar as much as you can to attract your users and keeping them on your blog for a longer time. Our team have introduced this gadget with a very easy installation, you don't need to add lots of css code to your blog template, as we are providing you with just a small piece of code that will do the same work.

ADD  PAGE NUMBERED NAVIGATION GADGET TO YOUR BLOG

1). Open your blog and go to Dashboard.

2). Select Layout and Edit HTML.

3). Find the following piece of code in your blog HTML code. HOW TO FIND CODE IN YOUR BLOG HTML CODE

]]></b:skin>

NOTE :- Before making any changes you should backup your blog template code. HOW TO BACKUP YOUR BLOG TEMPLATE

4). Copy and Paste the following code just above the code you have searched.

.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;
}

5). Find the following piece of code in your blog HTML code. 

</body>

6). Copy and Paste the following code just above the code you have searched. 

<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
</b:if>
</b:if>
<!--Page Navigation Ends -->
</body>

NOTE :- Some times we get a problem, In this we had shown 5 post per page and By default blogger label pages will show 20 posts. To fix this problem Go to Edit HTML > Check Expand Widget, Now find each appearance of 

'data:label.url'

and replace it with 

'data:label.url + "?&max-results=5"'

7). Save your template.

If you got a good experience than leave comments and Email Me for any assistance.