How to add wp PageNavi to Twenty Ten

I thought I’d post this since it’s a commonly used plugin and I just added it to my own site and styled it. Wp-PageNavi is a simple WordPress plugin that easily adds a numbered page navigation to your theme. I’ll show you how you can add it to the newest version of Twenty Ten Weaver theme. (currently 1.6 beta 6).
Start off by downloading and installing the plugin, then head to settings, (if you’re reading this for my own weaver style) turn off “Use pagenavi-css.css” and save. (if using it for another weaver style, leave it checked)
Next open the loop.php located in wp-contents/2010-weaver, you can edit this file through appearance > editor as well. Scroll near the bottom of the file and find the line that reads

<?php /* Display navigation to next/previous pages when applicable */ ?>

remove the entire section under this line, which is this block of code.

<?php if (  $wp_query->max_num_pages > 1 ) : ?>
	<div id="nav-below" class="navigation">
	    <div class="nav-previous"><?php next_posts_link( __( '<span class="meta-nav">&larr;</span> Older posts', TTW_TRANS ) ); ?></div>
	    <div class="nav-next"><?php previous_posts_link( __( 'Newer posts <span class="meta-nav">&rarr;</span>', TTW_TRANS ) ); ?></div>
	</div><!-- #nav-below -->
<?php endif; ?>

replace that block with this line of code

<?php wp_pagenavi(); ?>

Save loop.php and upload it back to your server. Refresh your site and scroll to the bottom, you should see a numbered page navigation at the bottom now.

The css for wp-PageNavi is already included with my FluxBB Weaver style so it should look fine after you do this. If you’re using it on another theme and want to style it, you can view the .css included with the plugin and add it to your own theme and change it to match your site.

Related Posts


4 Responses to How to add wp PageNavi to Twenty Ten

  1. zik says:

    i have my problem.. cannot appear the page navigation at my home page… the problem is , at the section “Page Navigation Text” which is ( Leaving a field blank will hide that part of the navigation.) when save , it disappear. But the below setting, which is (Page Navigation Options) when save after edit the setting, it save… can you solve it??

  2. Zeaks says:

    If the settings for pagenavi disappear then it’s an issue with the plugin. Maybe it’s conflicting with another plugin. Try disabling your plugins and only leave the pagenavi active, then see if it works. if it does, then activate the plugins one by one to see which one causes the problem.

Leave a Reply

Your email address will not be published. Required fields are marked *


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>