Always show Next and Previous button in wp_link_pages ?

Question

How do we get wp_link_pages() to show the Next and Previous button when it is the start of the multi-page post as well at the end of a multipage. Currently it only shows Next if it is the first page, and Previous at the end of the page.

Answer 1

I've just faced the same issue and here is my solution. I'm using globals to get current page and total page count:

/* first i'm looking into $multipage global to check 
if the post actually has pages */
global $multipage;

if ( $multipage === 1 ) {
    global $page; // this is current page number
    global $numpages; // this is total page count

    // display disabled left arrow on page 1
    if ( 1 === $page ) :
    ?>
        <span class="pagination__arrow pagination__arrow--prev pagination__arrow--disabled">< Previous</span>
        <span class="pagination__separator"> | </span>
    <?php 
    endif;

    // standard wp pagination
    wp_link_pages( [
        'next_or_number'   => 'next',
        'before'           => '',
        'previouspagelink' => '<span class="pagination__arrow pagination__arrow--prev">< Previous</span>',
        'nextpagelink'     => '<span class="pagination__arrow pagination__arrow--next">Next ></span>',
        'separator'        => '<span class="pagination__separator">|</span>',
    ] );

    // display disabled right arrow on last page
    if ( $page === $numpages ) :
    ?>
        <span class="pagination__separator"> | </span>
        <span class="pagination__arrow pagination__arrow--next pagination__arrow--disabled">Next ></span>
    <?php
    endif;

}

Answer 2

write a custom function that generates the pagination links with both Next and Previous buttons.

function custom_wp_link_pages() {
    global $page, $numpages, $multipage;

    if ( $multipage ) {
        $output = '<div class="pagination">';
        $prev = get_previous_posts_link( __('&laquo; Previous Page') );
        $next = get_next_posts_link( __('Next Page &raquo;') );

        if ( $prev || $next ) {
            if ( $prev ) {
                $output .= '<div class="prev-page">' . $prev . '</div>';
            }

            if ( $next ) {
                $output .= '<div class="next-page">' . $next . '</div>';
            }
        }

        $output .= '</div>';

        echo $output;
    }
}

// Usage in your template
custom_wp_link_pages();

Answer 3

You can take a look at this wp_link_pages Function