If you are using Blogger default comment system you might have noticed that when a post exceeds the limit of 200+ comments, only 200 oldest comments are displayed on that post. Above 200+ comments are not showing up now on the post pages, this is due to recently release of Blogger Threaded Comments, most of the old comments code get effected in the template. By using this comment pagination you can easily switch between newest and oldest comments. Now This tutorial will show you How to Fix 200+ Comments Pagination Page Problem In Blogger
Important : This tutorial will work only if you use blogger default comment system. Enabled Threaded Comments users can skip this tutorial.
Important : This tutorial will work only if you use blogger default comment system. Enabled Threaded Comments users can skip this tutorial.
How To Fix 200+ Comments Page Problem In Blogger
- Go to Blogger Dashboard
- Click on DropDown Menu and select Template
- Backup your Template before making any changes to your blog
- Now Click on Edit HTML --> Proceed --> Expand Widget Templates
- Press Ctrl + F and search the code shown below
<body>
- Now Paste the Code Shown Below just above/before it
<script type='text/javascript'>
//<![CDATA[
function commentpagination(url,comment){
var posturl= url;
var comment = comment;
cmpage = Math.ceil(comment/200);
document.write('<a rel="nofollow" href="'+posturl+'?commentPage=1">Old</a>');
for (var i = 1; i <= cmpage; i++) {
document.write('<a rel="nofollow" href="'+posturl+'?commentPage='+i+'">'+i+'</a>');
}
document.write('<a rel="nofollow" href="'+posturl+'?commentPage='+cmpage+'">New</a>');
}
//]]>
</script>
//<![CDATA[
function commentpagination(url,comment){
var posturl= url;
var comment = comment;
cmpage = Math.ceil(comment/200);
document.write('<a rel="nofollow" href="'+posturl+'?commentPage=1">Old</a>');
for (var i = 1; i <= cmpage; i++) {
document.write('<a rel="nofollow" href="'+posturl+'?commentPage='+i+'">'+i+'</a>');
}
document.write('<a rel="nofollow" href="'+posturl+'?commentPage='+cmpage+'">New</a>');
}
//]]>
</script>
- Press Ctrl + F and search the code shown below
<h4>
<b:if cond='data:post.numComments == 1'>
1 <data:commentLabel/>:
<b:else/>
<data:post.numComments/> <data:commentLabelPlural/>:
</b:if>
</h4>
<b:if cond='data:post.numComments == 1'>
1 <data:commentLabel/>:
<b:else/>
<data:post.numComments/> <data:commentLabelPlural/>:
</b:if>
</h4>
- Replace The Above Code With The Code Shown Below
<h4>
<b:if cond='data:post.numComments == 1'>
1 <data:commentLabel/>:
<b:else/>
<data:post.numComments/> <data:commentLabelPlural/>:
</b:if>
</h4>color:#289728
<b:if cond='data:post.numComments == 1'>
1 <data:commentLabel/>:
<b:else/>
<data:post.numComments/> <data:commentLabelPlural/>:
</b:if>
</h4>color:#289728
- Press Ctrl + F and search the code shown below
]]></b:skin>
- Now Paste the Code Shown Below just above/before it
/* -------------- Comment Pagination By www.mybloggertools.org --------*/
#commentpaging {background:#F4F4F4; margin:0px padding:20px auto; width:580px; border:1px solid #ddd; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; text-align:right;}
#commentpaging a { margin-right:5px;}
#commentpaging {background:#F4F4F4; margin:0px padding:20px auto; width:580px; border:1px solid #ddd; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; text-align:right;}
#commentpaging a { margin-right:5px;}
Make these customizations
- To Change background color of the box edit background:#F4F4F4
- To change the width of the box edit width:580px
- To change the color of Comment page text edit color:#289728
Like it? Share it.
No Comments
Click to Add a New Comment