Friday, April 27, 2012

How to add Blogger Page Pagination

#Go to "EDIT HTML"
Copy the css code below and paste this just before the closing </b:skin>
.showpageArea {
padding:10px;
}
.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #ccc;
margin:0 5px;
padding:5px;
background:#fff;
}
.showpageNum a:hover {
border: 1px solid #ccc;
background-color:#f0f0f0;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #ccc;
background: #f0f0f0;
margin:0 5px;
padding:5px;
}
.showpageOf {
text-decoration:none;
padding:5px;
margin: 0 5px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #ccc;
padding:5px;
background:#fff;
}
.showpage a:hover {
text-decoration:none;
background:#f0f0f0;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333;
}



#Copy the code below and paste this just before the closing </body>
<!--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=3;
var displayPageNum=5;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://fbt.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if>
</b:if>
<!--Page Navigation Ends -->

var pageCount = 3; the number of posts displayed on each page. The "pageCount" value and "Number of posts on main page" value (Present in the Design > Page Elements > Blog Post) is same.
var displayPageNum = 5; the number of links which are displayed.


#Check "Expand Widget Templates" and search for

'data:label.url'

Replace It with:

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

Make sure the Number is same as the value of "pageCount" value

#Save


13 comments:

  1. This comment has been removed by the author.

    ReplyDelete
  2. Template is oke very nice

    Thank

    Visit http://info4kamu.blogspot.com

    ReplyDelete
  3. I got error Error parsing XML, line 1456, column 58: The reference to entity "max-results" must end with the ';' delimiter.
    how can I fix this

    ReplyDelete
    Replies
    1. fixed it by replace with data:label.url + "?&max-results=7"
      is it still working :D

      Delete
    2. This comment has been removed by the author.

      Delete
  4. Great tips. Thanks for sharing.
    I think i should share SEO with Description Meta Tag in blogspot >>> see guide

    ReplyDelete
  5. hi
    not work for mee (is hidden)
    data:label.url + "?&max-results=5"
    please help me
    my blog: http://admiratork.blogspot.com

    ReplyDelete
  6. ITs work thanks please tell me how can it work in search
    my blog : http://h-couch.blogspot.com/

    ReplyDelete
  7. hey thanks very nice and simple looking navigation's, good work. Subway Surfers World Tour Rio 1.7.3

    ReplyDelete
  8. Thanks very nice widget

    my blog http://nafisflahi.blogspot.com

    ReplyDelete