phpwordpresspaginationcustom-pages

Add Pagination in custom Blog page template


I am using custom page for blogs(page-allblogs.php). I have not written all the code in this page because i wanted write clean codes. So this page has following codes:

<?php get_header();?>

<?php get_template_part('navigation'); ?>

<?php get_template_part('blogslist'); ?>

<?php get_footer();?>

The main code for blogs listing is in page bloglist.php

<div class="col-md-9">

        <!-- INDIVIDUAL BLOG ITEM LIST -->

          <?php
            $args = array(
            'posts_per_page' => 2,
            'post_type'     => 'blog', 
            'orderby'       => 'date',
            'order'         => 'DESC' 
            );

            $loop = new WP_Query($args);
            if($loop->have_posts()) {

            while($loop->have_posts()) : $loop->the_post();
          ?>
          <div class="blog-item">

          <div class="blog-item__top">
            <div class="blog-item__image">
              <a href="<?php the_permalink();?>">
                <?php $image = get_field('image');
                if( !empty($image) ): ?>

                  <img src="<?php echo $image['url']; ?>" class="img-responsive" alt="<?php echo $image['alt']; ?>" />

                <?php endif; ?>
              </a>
            </div>

            <div class="blog-item__detail">
              <ul>
                <li><a href="#"><i class="fa fa-calendar" aria-hidden="true"></i><?php the_time('M j, Y');?></a></li>
                <li><a href="#"><i class="fa fa-thumbs-up" aria-hidden="true"></i>201 LIKES</a></li>
                <li><a href="#"><i class="fa fa-comment" aria-hidden="true"></i>15 COMMENTS</a></li>
              </ul>
            </div>
          </div>

          <div class="blog-item__bottom">
            <div class="row">
              <div class="col-md-3 blog-item__bottom_left">
                <h5>Author: <a href="<?php echo get_author_posts_url(get_the_author_meta('ID'))?>"><?php the_author();?> </a></h5>
                <h6>Category: Football</h6>
              </div>
              <div class="col-md-9 blog-item__bottom_right">
                <h3><a href="<?php the_permalink();?>"><?php the_title();?></a></h3>
                <p>
                  <?php echo get_excerpt(500); ?>
                </p>
                <div class="button-div">
                    <div class="primary-button">
                      <a href="<?php the_permalink(); ?>"> Read More</a>
                    </div>
                </div>
              </div>
            </div>
          </div>

        </div>
          <?php  endwhile;
            }
          ?>
<?php wpbeginner_numeric_posts_nav(); ?>
      </div>

I am using wpbeginner's pagination code which i have put in functions.php.

function wpbeginner_numeric_posts_nav() {

 if( is_singular() )
        return;


    global $wp_query, $loop;
if ( $loop ) {
    $total = $loop->max_num_pages;
} else {
    $total = $wp_query->max_num_pages;
}

    /** Stop execution if there's only 1 page */
    if( $total <= 1 )
        return;

    $paged = get_query_var( 'paged' ) ? absint( get_query_var( 'paged' ) ) : 1;
    $max   = intval( $total );

    /** Add current page to the array */
    if ( $paged >= 1 )
        $links[] = $paged;

    /** Add the pages around the current page to the array */
    if ( $paged >= 3 ) {
        $links[] = $paged - 1;
        $links[] = $paged - 2;
    }

    if ( ( $paged + 2 ) <= $max ) {
        $links[] = $paged + 2;
        $links[] = $paged + 1;
    }

    echo '<div class="navigation"><ul>' . "\n";

    /** Previous Post Link */
    if ( get_previous_posts_link() )
        printf( '<li>%s</li>' . "\n", get_previous_posts_link() );

    /** Link to first page, plus ellipses if necessary */
    if ( ! in_array( 1, $links ) ) {
        $class = 1 == $paged ? ' class="active"' : '';

        printf( '<li%s><a href="%s">%s</a></li>' . "\n", $class, esc_url( get_pagenum_link( 1 ) ), '1' );

        if ( ! in_array( 2, $links ) )
            echo '<li>…</li>';
    }

    /** Link to current page, plus 2 pages in either direction if necessary */
    sort( $links );
    foreach ( (array) $links as $link ) {
        $class = $paged == $link ? ' class="active"' : '';
        printf( '<li%s><a href="%s">%s</a></li>' . "\n", $class, esc_url( get_pagenum_link( $link ) ), $link );
    }

    /** Link to last page, plus ellipses if necessary */
    if ( ! in_array( $max, $links ) ) {
        if ( ! in_array( $max - 1, $links ) )
            echo '<li>…</li>' . "\n";

        $class = $paged == $max ? ' class="active"' : '';
        printf( '<li%s><a href="%s">%s</a></li>' . "\n", $class, esc_url( get_pagenum_link( $max ) ), $max );
    }

    /** Next Post Link */
    if ( get_next_posts_link() )
        printf( '<li>%s</li>' . "\n", get_next_posts_link() );

    echo '</ul></div>' . "\n";

}

Since i am using custom query loop, i have used $loop in the function wpbeginner_numeric_posts_nav(). but still my pagination is not showing. Can anyone help me find the issue. I am really stuck in this.


Solution

  • I missed this in my $args.

    $paged = get_query_var( 'paged' ) ? absint( get_query_var( 'paged' ) ) : 1;