Replace WooCommerce Default Pagination with WP-PageNavi Pagination

If you have used the WooCommerce eCommerce plugin for WordPress, you have seen that the default Next and Previous Page links pagination page navigation is not very pretty. This small tip is a Tutorial that shows you how to add the WordPress plugin WP-PageNavi to a WooCommerce WordPress site in 3 easy steps to make your product archive page navigation easier to use and improve it’s look with numbered blocks instead of just next/previous links.

Replace WooCommerce Default Pagination with WP-PageNavi Pagination

Replace WooCommerce Default Pagination with WP-PageNavi Pagination

You can download this free WordPress Pagination plugin at WordPress.org’s Plugin Repository – WP-PageNavi.

Step 1: You should download and install WP-PageNavi into your WordPress plugins directory and then activate the plugin in your WordPress Dashboard.

Step 2: Once it is installed, you can set up the options using the settings page for this plugin in your WordPress Dashboard.

Step 3: After you have the settings set up, add this code below to your current theme’s Functions.php file to have WP-PageNavi’s pagination replace WooCommerce’s default page navigation:

/*
 * Replace WooCommerce Default Pagination with WP-PageNavi Pagination
 */
remove_action('woocommerce_pagination', 'woocommerce_pagination', 10);
function woocommerce_pagination() {
        wp_pagenavi();         
    }
add_action( 'woocommerce_pagination', 'woocommerce_pagination', 10);

That’s it, now you have a much better looking and easier to use Pagination Page Navigation on your WooCommerce Product Archive Pages.

Leave a Reply

2 Comments on "Replace WooCommerce Default Pagination with WP-PageNavi Pagination"

Notify of
avatar
Iggy
Guest

It works, thanks!

hoc facebook ads o dau tot tai tphcm
Guest

Hello to all, how is the whole thing, I think every one
is getting more from this website, and your views are nice designed for
new visitors.

wpDiscuz