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.

About Ricky1990

I'm Ricky, a programmer. My interests are Marketing Online, Wordpress, SEO, Make Money Online and Software. Besides computers, i am crazy for bussiness projects, web development consulting and work as a speaker about these fields.

Comments

  1. It works, thanks!

Speak Your Mind

*