WordPress at Your Fingertips

Pagination for WordPress Post Content

Not everyone knows that in WordPress a single post or page can be divided into several parts, thus organizing the pagination for the post. To do this you need to use the shotcode <!--nextpage--> in the content. This code will divide the text of the post into multiple pages. And URL, for example, the second page will look like this: http://example.com/hello-world/2/.

This feature is useful for those who plan to post long entries with lots of images or text. In this case it's convenient to divide such a long content into parts (subpages).

See also the description of the linked function: wp_link_pages().

Such pagination is not often used, so there is no button in the standard WordPress editor (TinyMCE) for such pagination. Pagination is achieved by pasting the following html code in the post content in the right place:

<!--nextpage-->

Or by pressing key combination Shift + Alt + P in visual editor, the same HTML comment will be inserted into post content: <!--nextpage-->.

After inserting this comment code, the following pagination will appear in the frontend page (it depends on the theme design):

And every pagination page will have a such URL:

  • http://example.com/hello-world/2/
  • http://example.com/hello-world/3/

Adding a button to the visual editor

When you need frequent insertion of such a tag splitting the page into several subpages, it is convenient to have a button to insert the needed tag.

To add an appropriate button to the WordPress editor, you need to add a small snippet of code to the functions.php file:

## Adding a page break button to TyniMCE Editor
add_filter( 'mce_buttons', 'mce_page_break' );

function mce_page_break( $mce_buttons ){
	$pos = array_search('wp_more', $mce_buttons, true );
	if( $pos !== false ){
		$buttons     = array_slice( $mce_buttons, 0, $pos + 1 );
		$buttons[]   = 'wp_page';
		$mce_buttons = array_merge( $buttons, array_slice($mce_buttons, $pos + 1) );
	}
	return $mce_buttons;
}

After that, a new button will appear in the editor:

The same result can be achieved by installing the plugin TinyMCE Page Break Button

Theme support

Note that not all WordPress themes provide page or post pagination output.

Your theme's corresponding template file must contain the function wp_link_pages() after page content output:

wp_link_pages( array(
	'before'      => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentyfifteen' ) . '</span>',
	'after'       => '</div>',
	'link_before' => '<span>',
	'link_after'  => '</span>',
	'pagelink'    => '<span class="screen-reader-text">' . __( 'Page', 'twentyfifteen' ) . ' </span>%',
	'separator'   => '<span class="screen-reader-text">, </span>',
) );

Global variables

When you want to check if a post is paginated, how many pages there are, get the content of a particular page, etc. You can use global variables, which are defined inside WordPress Loop, by function setup_postdata(), which in turn is called either directly or via function the_post().

A list of such global variables inside the loop:

$page(number).
The page of the current post when the post is paginated using the <!--nextpage--> tag.
$pages(array)
The page content of the current post. Each page here is separated by the <!--nextpage--> tag.
$multipage(bool)
Determines whether the current entry is paginated with the <!--nextpage--> tag. Contains true or false.
$numpages(number).
The number of pages if the post is paginated using the <!--nextpage--> tag.

You can use these global variables to do these checks, inside the loop:

# Verification of post pagination

Example 1

$paged = $wp_query->get( 'page' );

if ( $paged < 2 ){
	// This is the first page or the post is not divided into pages
}
else {
	// This is page 2,3,4 ... page of a split post.
}

Example 2

$paged = get_query_var( 'page' ) ?: false;
if ( $paged < 2 ){
	// The post is not divided into pages or it is not the first page.
}
else {
	// This is page 2,3,4 ... page of a split post.

}

Example 3

Let's check if the post is paginated.

the_post();

if( ! empty( $GLOBALS['multipage'] ) ){
	// the post is divided into pages
}

Find out how many pages the entry has

the_post();

if( ! empty( $GLOBALS['numpages'] ) ){

	if( $GLOBALS['numpages'] === 1 ){
		// post is divided into pages
	}
	else {
		// post is divided into pages
		echo "Number of pages {$GLOBALS['numpages']}";
	}
}
No comments
    Log In