How to Create WordPress Pagination Without Plugin?

The next page and previous page links in WordPress default to the blog page. Pagination lets your users navigate across numerous pages of material. I’m utilizing WordPress’s built-in paginate links in this article on How to Create WordPress Pagination Without Plugin.

Using the Custom Query with the Correct Paged Parameter

Using the Correct Paged Parameter in the Custom Query :

<?php
$custom_query_args = array(
    // Custom query parameters go here
);
?>

Orignal Source:- WordPress Pagination Without Plugin

The right paged the argument must be sent to the array. You may do so by using get_query_var() to retrieve the URL query variable used to identify the current page :

<?php get_query_var( 'paged' ); ?>

That parameter may then be appended to your custom query args array :

<?php
$custom_query_args['paged'] = get_query_var( 'paged' ) 
    ? get_query_var( 'paged' ) 
    : 1;
?>

Note: If your page is a static front page, be sure to use page instead of paged as a static front page uses page and not paged. This is what a static top page should look like.

<?php
$custom_query_args['paged'] = get_query_var( 'page' ) 
    ? get_query_var( 'page' ) 
    : 1;
?>

Pagination functions using custom query objects :

WordPress must be made to recognize the custom query for pagination capabilities to produce the right output – i.e. previous/next/page links relative to the custom query. This necessitates a “hack” in which the basic $wp query object is replaced with the custom query object, $custom query :

The primary query object has been hacked

• The primary query object should be backed up: $wp query.
• The primary query object is null: $wp query = $wp query.
• Replace the custom query with the primary query object: $custom query = $wp query.

   $temp_query = $wp_query;
   $wp_query   = NULL;
   $wp_query   = $custom_query;

Contains all code :

A simple build of a custom query loop with correctly working pagination in WordPress without plugin methods is as follows :

<?php
    add_filter( 'storefront_before_footer','geekerhub_add_Pagination' );
    function geekerhub_add_Pagination($true){
        if ( get_query_var('paged') ) {
            $paged = get_query_var('paged');
        } elseif ( get_query_var('page') ) { //'page' is used instead of 'paged' in front page
            $paged = get_query_var('page');
        } else {
            $paged = 1;
        }
    
    $custom_query_args = array(
    'post_type' => 'post', 
    'posts_per_page' => get_option('posts_per_page'),
    'paged' => $paged,
    'post_status' => 'publish',
    'ignore_sticky_posts' => true,
    //'category_name' => 'custom-cat',
    'order' => 'DESC', // 'ASC'
    'orderby' => 'date' // modified | title | name | ID | rand
     );

    $custom_query = new WP_Query( $custom_query_args );

    if ( $custom_query->have_posts() ) :
    while( $custom_query->have_posts() ) : $custom_query->the_post(); ?>
          <?php //I've included an example of basic navigation.
                // Enter your code below?>
        <nav aria-label="Page navigation example">
        <ul class="pagination justify-content-center">
            <li class="page-item disabled">
            <a class="page-link" href="#" tabindex="-1">Previous</a>
            </li>
            <li class="page-item"><a class="page-link" href="#">1</a></li>
            <li class="page-item"><a class="page-link" href="#">2</a></li>
            <li class="page-item"><a class="page-link" href="#">3</a></li>
            <li class="page-item">
            <a class="page-link" href="#">Next</a>
            </li>
        </ul>
        </nav>

    <?php
    endwhile;
    ?>

    <?php if ($custom_query->max_num_pages > 1) : // custom pagination  ?>
        <?php
        $orig_query = $wp_query; // fix for pagination to work
        $wp_query = $custom_query;
        ?>
       <nav class="prev-next-posts">
         <div class="prev-posts-link">
           <?php echo get_next_posts_link( 'Older Entries', $custom_query->max_num_pages ); ?>
         </div>
         <div class="next-posts-link">
           <?php echo get_previous_posts_link( 'Newer Entries' ); ?>
         </div>
       </nav>
         <?php
         $wp_query = $orig_query; // fix for pagination to work
         ?>
      <?php endif; ?>

      <?php
      wp_reset_postdata(); // reset the query 
      else:
      echo '<p>'.__('Sorry, no posts matched your criteria.').'</p>';
      endif;
    }
?>