{"id":2741,"date":"2012-10-26T21:39:49","date_gmt":"2012-10-26T21:39:49","guid":{"rendered":"http:\/\/www.dognmonkey.com\/techs\/?p=2741"},"modified":"2018-01-31T14:13:18","modified_gmt":"2018-01-31T22:13:18","slug":"how-to-use-wp-pagenavi-and-wp-commentnavi-plugins","status":"publish","type":"post","link":"https:\/\/www.dognmonkey.com\/techs\/how-to-use-wp-pagenavi-and-wp-commentnavi-plugins.html","title":{"rendered":"How To Use WP-PageNavi And WP-CommentNavi Plugins"},"content":{"rendered":"

I’ve been looking ways to paginate my main page posts list, singles, pages and comments, I couldn’t find any answers until I studied about the plugins from\u00a0 Lester Chan-GamerZ<\/a> , among those, WP-PageNavi<\/a> and WP-CommentNavi<\/a>, I finally found the way to use them for paginate my pages, posts and comments. This is the way I use them with Mono-lab themes: Flat and PianoBlack.<\/em><\/p>\n

If we’re using WordPress 3.4.2, most of these pagination php are already embedded in the system and called out somewhere in our themes, all we need is to find where to place these plugins codes. For blog main page posts pagination, we need to have excerpts turned on and working. The theme files that need to implement with WP-PageNavi codes are: index.php, archive.php and search.php.<\/em><\/p>\n

<\/em>For Single Post pagination, by using “next-page” while editing, the theme files that need to implement with WP-PageNavi are: single.php and page.php.<\/em><\/p>\n

MAIN PAGE POSTS LIST PAGINATION WITH EXCERPTS<\/em><\/strong><\/p>\n

\"main\"<\/a><\/p>\n

Well, we need to install the plugin WP-PageNavi first, activate it and modify some settings if we want, I only modify “<<” and “>>” with “<< Previous” and “Next >>”<\/em><\/p>\n

\"\"<\/a>\u00a0\u00a0\u00a0\u00a0 \"main\"<\/a><\/p>\n

Save “settings” and open “index.php”, “archive.php” and “search.php” to search and replace codes with pagenavi codes. We need to search for “pager” and we should find these lines in these files. The if options ‘pager’ is for paginate when we have many posts with excerpts on the same page (which number of posts is set in settings-reading).<\/em><\/p>\n

\"pager\"<\/a> \u00a0\u00a0\u00a0\u00a0 \"pager\"<\/a><\/em><\/p>\n

In PianoBlack theme, the main page pagination was used with “navigation.php”, we need to remove the include statement, your theme may not have this “navigation.php”.<\/em><\/p>\n

Now we should have main page with post listed with WP-PageNavi plugin. I modified the pagenavi-css.css in the plugins\/wp-pagenavi\/ with some borders and background.<\/em><\/p>\n

\n

<\/em>.wp-pagenavi {
\nclear: both;
\nmargin-bottom:40px;
\nmargin-top:30px;
\n}<\/p>\n

.wp-pagenavi a, .wp-pagenavi span {
\ntext-decoration: none;
\nborder: 1px solid #333;
\npadding: 10px 15px;
\n-moz-border-radius:3px; -khtml-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;
\nbackground:#101010;
\n}<\/p>\n

.wp-pagenavi a:hover, .wp-pagenavi span.current {
\nborder-color: #000;
\n}<\/p>\n

.wp-pagenavi span.current {
\nfont-weight: bold;
\n}<\/p><\/blockquote>\n

<\/em>WP-PAGENAVI WITH LONG SINGLE POST – PAGE PAGINATION<\/em><\/strong><\/p>\n

<\/em><\/strong>If we have long posts with many “next-page” inserts, we want to display with WP-PAGENAVI, all we need to do is to replace all ‘<?php wp_link_pages(); ?>’ with ‘<?php wp_pagenavi( array( ‘type’ => ‘multipart’ ) ); ?>’ in “single.php” and “page.php” of your themes.<\/em><\/p>\n

\n

<?php wp_pagenavi( array( ‘type’ => ‘multipart’ ) ); ?><\/em><\/p>\n<\/blockquote>\n

<\/em>\"links\"<\/a>\u00a0\u00a0\u00a0\u00a0 \"\"<\/a><\/p>\n

Now, we should have both Main page posts list and long single post-page paginated with WP-PageNavi plugin.<\/em><\/p>\n

<\/em>\"single\"<\/a>\u00a0\u00a0\u00a0\u00a0 \"main<\/a><\/p>\n

WP-COMMENTNAVI FOR COMMENT.PHP<\/em><\/strong><\/p>\n

<\/em><\/strong>Again, install WP-CommentNavi plugin, activate, and go to settings – commentnavi – to modify anything you like.<\/em><\/p>\n

\"settings\"<\/a>\u00a0\u00a0\u00a0\u00a0 \"commentnavi\"<\/a><\/p>\n

Now, open “comments.php” of your theme and search for ‘pager’ again, for this to work, we have to turn on the option in “discussion”<\/em><\/p>\n

<\/em>\"discussion\"<\/a>\u00a0\u00a0\u00a0\u00a0 \"comments\"<\/a><\/p>\n

Dependent upon how your comments.php in your theme is written, you should be able to find ‘pager’ and ‘paginate_comment_link()’, delete this line and place the commentnavi codes below the comment_pager<\/em><\/p>\n

<\/em>\"links\"<\/a>\u00a0\u00a0\u00a0\u00a0 \"commentnavi\"<\/a><\/p>\n

In PianoBlack theme, I had to delete the ‘}}’ after delete “paginate_comment_link” and added the commentnavi codes.<\/em><\/p>\n

\n

<\/em><?php if(function_exists(‘wp_commentnavi’)) { wp_commentnavi(); } ?><\/p>\n<\/blockquote>\n

Now we should have comments paginated with WP-CommentNavi plugin<\/em><\/p>\n

<\/em>\"commentnavi\"<\/a><\/p>\n

I did modify the commentnavi-css.css in the plugins\/wp-commentnavi\/<\/em><\/p>\n

\n

<\/em>.wp-commentnavi a, .wp-commentnavi a:link {
\npadding: 10px 15px;
\nmargin: 2px;
\ntext-decoration: none;
\nborder: 1px solid #ff9966;
\ncolor: #120000;
\nbackground-color: #ffddbb;\u00a0\u00a0 \u00a0-moz-border-radius:3px; -khtml-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;
\n}
\n.wp-commentnavi a:visited {
\npadding: 10px 15px;
\nmargin: 2px;
\ntext-decoration: none;
\nborder: 1px solid #ffddbb;
\ncolor: #120000;
\nbackground-color: #ff9966;
\n}
\n.wp-commentnavi a:hover {
\nborder: 1px solid #800517;
\ncolor: #800517;
\nbackground-color: #ffddbb;
\n}
\n.wp-commentnavi a:active {
\npadding:10px 15px;
\nmargin: 2px;
\ntext-decoration: none;
\nborder: 1px solid #ff9966;
\ncolor: #800517;
\nbackground-color: #ffddbb;
\n}
\n.wp-commentnavi span.pages {
\npadding: 10px 15px;
\nmargin: 2px;
\ncolor: #800517;
\nborder: 1px solid #ff9966;
\nbackground-color: #ffddbb;-moz-border-radius:3px; -khtml-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;
\n}
\n.wp-commentnavi span.current {
\npadding: 10px 15px;
\nmargin: 2px;
\nfont-weight: bold;
\n\/*\u00a0\u00a0 \u00a0border: 1px solid #000000;*\/
\ncolor: #800517;
\nbackground-color: #ffddbb;-moz-border-radius:3px; -khtml-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;
\n}
\n.wp-commentnavi span.extend {
\npadding: 10px 15px;
\nmargin: 2px;
\nborder: 1px solid #ff9966;
\ncolor: #120000;
\nbackground-color: #ffddbb;
\n}
\n.wp-commentnavi-all-comments-link {
\n}<\/p>\n<\/blockquote>\n

I’ve been searching for many days to get these things to work and none of them really show much of anything. Hope these will work on your theme as they work on mine. I have tested these plugins with list category posts with pagination and they don’t work together, the pageviews came out wrong. My next one is to get category post list to paginate. If you see any problems, please let me know so we can figure it out together.<\/em><\/p>\n

<\/em>Cheers,<\/em><\/p>\n

<\/em>