A Complete Guide to Implementing Post Pagination in WordPress Without Plugins

Implementing Post Pagination in WordPress (No Plugin Required)

WordPress includes built-in functionality to split long posts into multiple pages. This can be achieved without installing any plugins, requiring only simple code configuration. Follow this complete guide.

Step 1: Enable the Pagination Button in the Editor

By default, the pagination button might be hidden in the Classic Editor (TinyMCE) toolbar. You need to add it manually.

Open your current theme's functions.php file and add the following code at the end:

function enable_more_buttons($buttons) {
    $buttons[] = 'wp_page';
    return $buttons;
}
add_filter("mce_buttons_3", "enable_more_buttons");

Save the file and refresh your WordPress admin panel. You should now see the "Insert Page Break" button (usually an icon with two rectangles separated by a dotted line) in the third row of the Classic Editor toolbar.

Note: If you use the Gutenberg block editor, pagination is built-in. Simply add the "Page Break" block while editing a post.

Step 2: Output Pagination Links in Your Theme Template

Inserting page breaks is not enough; you must also call a function in your theme template to display the navigation links.

Locate your theme's single.php file (or the main template file for displaying single posts). Find the line that outputs the post content, typically:

<?php the_content(); ?>

Add the following code below that line:

<?php wp_link_pages(); ?>

Save the file. Now, when you write a post using page breaks, a default numeric page navigation will appear at the bottom.

Step 3: Customize Pagination Style and Layout

The default pagination style may not match your design. The wp_link_pages() function provides extensive parameters for customization. Here are two common approaches.

Option 1: Compact Navigation with "Previous/Next"

This combines a "Pages:" label, number links, and "Previous/Next" links.

<?php
wp_link_pages(array(
    'before' => '<div class="wp-pagenavi"><p><span class="pages">Pages: </span>',
    'after' => '</p></div>',
    'link_before' => '<span class="page-number">',
    'link_after' => '</span>',
    'next_or_number' => 'number',
    'pagelink' => '%'
));
?>
<?php
wp_link_pages(array(
    'before' => '<div class="single-navi">',
    'after' => '</div>',
    'next_or_number' => 'next',
    'previouspagelink' => '&laquo; Previous',
    'nextpagelink' => 'Next &raquo;'
));
?>

Option 2: "Previous/Next" Links on Separate Sides

This places "Previous" on the left, page numbers in the center, and "Next" on the right for a clearer layout.

<div class="post-pagination">
    <?php
    // Output "Previous" link
    wp_link_pages(array(
        'before' => '',
        'after' => '',
        'next_or_number' => 'next',
        'previouspagelink' => '&laquo; Previous',
        'nextpagelink' => ''
    ));
    ?>
    <?php
    // Output number links
    wp_link_pages(array(
        'before' => '',
        'after' => '',
        'next_or_number' => 'number',
        'link_before' => '<span>',
        'link_after' => '</span>'
    ));
    ?>
    <?php
    // Output "Next" link
    wp_link_pages(array(
        'before' => '',
        'after' => '',
        'next_or_number' => 'next',
        'previouspagelink' => '',
        'nextpagelink' => 'Next &raquo;'
    ));
    ?>
</div>

Tip: The HTML class names (e.g., wp-pagenavi, single-navi) in the code above can be used to add CSS styles for visual customization.

wp_link_pages() Function Parameters Explained

Understanding the function's parameters allows for flexible customization. Key parameters:

• before (string): HTML/text output before all pagination links. Default: <p>Pages: .
• after (string): HTML/text output after all links. Default: </p>.
• link_before (string): HTML/text before each individual page link. Default empty.
• link_after (string): HTML/text after each individual page link. Default empty.
• next_or_number (string): Controls link type.
  • 'number' (default): Shows numeric page links.
  • 'next': Shows "Previous" and "Next" links.
• nextpagelink (string): Text for the "Next" link. Default: "Next page".
• previouspagelink (string): Text for the "Previous" link. Default: "Previous page".
• pagelink (string): Format string for page links; % is replaced by the page number. Default: %.
• echo (boolean): Whether to output the result directly.
  • true or 1 (default): Outputs HTML.
  • false or 0: Returns the HTML string for use in other PHP code.

By combining these parameters, you can create pagination navigation that perfectly integrates with your site's design.