Using the_posts_pagination for custom page template WordPress

If you look my sitemap, you’ll see the list of my post with pagination. That page was created under custom page template, the custom WP_Query of post’s list build under main loop of page, and function the_posts_pagination to display pagination.

Here the sample PHP code that you can accomplish if you need create custom page template with pagination. Just add after your main query loop.

// Define page_id
$page_ID = get_the_ID();

// Define paginated posts
$page    = get_query_var( 'page' );

// Define custom query parameters
$args    = array(
	'post_type'      => array( 'post', 'book', 'movie' ), // post types
	'posts_per_page' => 5,
	'paged'          => ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1
);

// If is_front_page "paged" parameters as $page number
if ( is_front_page() )
	$args['paged'] = $page;

// Instantiate custom query
$custom_query = new WP_Query( $args );

// Custom loop
if ( $custom_query->have_posts() ) :
    while ( $custom_query->have_posts() ) :
        $custom_query->the_post();

		/**
		 * Displaying content
		 *
		 * the_title(), the_permalink(), the_content() etc
		 * Or see Twentysixteen theme page.php
		 * get_template_part( 'template-parts/content', 'page' );
		 *
		 */
    endwhile;

		/**
		 * Pagination parameters of the_posts_pagination() since: 4.1.0
		 *
		 * @see the_posts_pagination
		 * https://codex.wordpress.org/Function_Reference/the_posts_pagination
		 *
		 */
		$pagination_args = array(
			'prev_text'          => __( 'Previous page', 'theme-domain' ),
			'next_text'          => __( 'Next page', 'theme-domain' ),
			'before_page_number' => '<span class="meta-nav screen-reader-text">' . __( 'Page', 'theme-domain' ) . ' </span>'
		);

		/**
		 * Fix pagination link base
		 *
		 * If in paginated posts w/o multiple loop
		 *
		 */

		if ( ! is_front_page() && 0 < intval( $page ) )
			$pagination_args['base'] = user_trailingslashit(
				untrailingslashit( get_page_link( $page_ID ) ) . '/page/%#%'
			);
		/**
		 * Fix Pagination with $GLOBALS['wp_query'] = {custom_query}
		 *
		 * @see get_the_posts_pagination use $GLOBALS['wp_query']
		 * https://developer.wordpress.org/reference/functions/get_the_posts_pagination/#source-code
		 *
		 */
		$GLOBALS['wp_query'] = $custom_query;
		the_posts_pagination( $pagination_args );
else :
	/**
	 * Empty Post
	 *
	 * Run your stuff here if posts empty
	 * Or see Twentysixteen theme page.php
	 * get_template_part( 'template-parts/content', 'none' );
	 */
endif;
wp_reset_query(); // Restore the $wp_query and global post data to the original main query.

We using get_page_link on paging arguments code instead of get_pagenum_link function, it just to making work with main loop if using post page ( wp_link_pages ~ <--nextpage--> ) for your content. I think there are better clean approach than this, but.. ah, let’s go ready to rumble.

UPDATE: April 08, 2016

  • Fix pagination if set in front page

5 Replies to “Using the_posts_pagination for custom page template WordPress”

  1. om, masukan aja nih… blog ini kan pake dmca. saran…

    om, masukan aja nih… blog ini kan pake dmca. saran ane untuk source biar ngga ribet ngetik ulang kasih link ke pastebin aja. biar yang mau praktek ngga ngetik ulang :D

  2. can you be specific awesome abang? main loop page its…

    can you be specific awesome abang?
    main loop page its mean index.php or what?
    soory if my english is bad i am indonesian awesome abang :D

    • we are the same lol. No, in example if use…

      we are the same lol. No, in example if use Twentysixteen theme, create custom page template and copy the source code from page.php, you’ll get main loop from content-page.php.

Leave a Reply

*

*