Pagination helps users browse your website. It divides content into pages. Numeric pagination shows page numbers. Users click to move to the next page. This guide will show you how to add numeric pagination to your WordPress theme.

Why Add Numeric Pagination?

Numeric pagination improves user experience. It makes navigation easy. Users find content faster. They do not need to scroll endlessly. This also reduces bounce rates. Happy users stay longer on your site.

Credit: www.wpbeginner.com

Step-by-Step Guide

Follow these simple steps. You will learn how to add numeric pagination to your WordPress theme. No coding experience is necessary. Let’s get started.

Step 1: Backup Your Website

Before making changes, back up your site. This ensures your data is safe. Use a plugin like UpdraftPlus. You can restore your site if something goes wrong.

Step 2: Create A Child Theme

Do not edit your main theme directly. Create a child theme. This keeps your changes safe during updates.

To create a child theme:

1. Go to your WordPress folder.
2. Open the wp-content/themes folder.
3. Create a new folder. Name it after your theme with -child at the end.
4. Inside the new folder, create a style.css file.
5. Paste this code into the style.css file:

/
 Theme Name:   Your Theme Child
 Template:     your-theme
/

Replace Your Theme Child with your theme’s name. Replace your-theme with your theme’s folder name.

Next, create a functions.php file in the child theme folder. Add this code:

php
function my_theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
?

This ensures your child theme uses the parent theme’s styles.

Step 3: Add Pagination Function

Now, add the pagination function. Open your child theme’s functions.php file. Add this code:

php
function numeric_pagination() {
    global $wp_query;

    $big = 999999999; // need an unlikely integer
    $pages = paginate_links( array(
        'base'      = str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
        'format'    => '?paged=%#%',
        'current'   => max( 1, get_query_var('paged') ),
        'total'     => $wp_query->max_num_pages,
        'type'      => 'array',
        'prev_text' => __('«'),
        'next_text' => __('»'),
    ) );

    if( is_array( $pages ) ) {
        $paged = ( get_query_var('paged') == 0 ) ? 1 : get_query_var('paged');

        echo '
';
        foreach ( $pages as $page ) {
            echo "
$page
";
        }
        echo '
';
    }
}
?>

This function creates pagination links.

Step 4: Call The Pagination Function

Now, call the function in your theme. Open your child theme’s index.php file. Find the loop. It looks like this:

php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?
 Your loop code 
php endwhile; endif; ?

Add the pagination function after the loop:

php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?
 Your loop code 
php endwhile; numeric_pagination(); endif; ?

This calls the pagination function. It will display pagination links.

Step 5: Style The Pagination Links

Style the pagination links to match your theme. Open your child theme’s style.css file. Add this CSS:

.pagination {
    display: flex;
    list-style: none;
    padding: 0;
}

.pagination li {
    margin: 0 5px;
}

.pagination li a {
    text-decoration: none;
    padding: 5px 10px;
    border: 1px solid #ddd;
    color: #333;
}

.pagination li a:hover {
    background-color: #f0f0f0;
}

.pagination .current {
    font-weight: bold;
    background-color: #333;
    color: #fff;
}

This styles the pagination links. You can customize the styles as needed.

Credit: qodeinteractive.com

Frequently Asked Questions

What Is Numeric Pagination In WordPress?

Numeric pagination is a navigation tool that shows page numbers at the bottom of posts.

How Can I Add Pagination To My WordPress Theme?

Use a plugin or custom code to add numeric pagination to your theme.

Why Is Numeric Pagination Important For Seo?

Numeric pagination helps search engines crawl and index content more effectively, improving SEO.

Which Plugins Add Numeric Pagination In WordPress?

Plugins like WP-PageNavi or Pagination by BestWebSoft can add numeric pagination.

Conclusion

Adding numeric pagination improves user experience. It helps users navigate your site easily. Follow the steps in this guide. You will have numeric pagination in your WordPress theme. It is easy and does not require coding experience. Happy coding!