skip to Main Content

I can’t seem to get my pagination working.

I have been through many similar questions on Stack Overflow and tried to modify it but nothing seems to work.

EDIT – I’m trying to get numbered pagination – I’m not even sure the
examples I have tried are numbered.

My code without any attempts is

<section id="blog-posts" class="latest-blog-posts full-width standard-padding">
    
    <div class="full-width-inner">
    
    
                    
                    <div class="the-posts">
                      
                         <?php 
                         // Define our WP Query Parameters
                         $the_query = new WP_Query( 'posts_per_page=9' ); ?>
                           
                          
                         <?php 
                         // Start our WP Query
                         while ($the_query -> have_posts()) : $the_query -> the_post(); 
                         // Display the Post Title with Hyperlink
                         ?>
                           
                          
                         <div class="post">
                             
                             <div class="post-thumb">
                                  <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?>
                                  <img src="<?php echo $image[0]; ?>" alt="" />
                              </div>
                             
                             <h2 class="post-title-teaser"><?php the_title(); ?></h2>
                             
                             <div class="post-date-preview"><p><?php echo get_the_date(); ?></p></div>

                               
                             <div class="post-excerpt"><?php
                             the_excerpt(); ?></div>
                             
                             
                
                            <div class="elc-button post-button"><a class="read-on elc-button" aria-label="read more of the article about '<?php the_title(); ?>'" href="<?php the_permalink() ?>">Read More</a></div>
    
                                 
                            
                             
                         </div>
                           
                          
                         <?php 
                         // Repeat the process and reset once it hits the limit
                         endwhile;
                         wp_reset_postdata();
                         ?>
                         
                    </div>   
                 
        
    </div>
    

</section>  

My latest attempts at adding pagination are

<section id="blog-posts" class="latest-blog-posts full-width standard-padding">
    
    <div class="full-width-inner">
    
        <div class="the-posts">
            <?php 
                if ( ! function_exists( 'pagination' ) ) :
                        
                    function pagination( $paged = '', $max_page = '' ) {
                    $big = 999999999; // need an unlikely integer
                    if( ! $paged ) {
                        $paged = get_query_var('paged');
                    }
                        
                    if( ! $max_page ) {
                        global $wp_query;
                        $max_page = isset( $wp_query->max_num_pages ) ? $wp_query->max_num_pages : 1;
                    }
                        
                    echo paginate_links( array(
                        'base'      => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
                        'format'    => '?paged=%#%',
                        'current'   => max( 1, $paged ),
                        'total'     => $max_page,
                        'mid_size'  => 1,
                        'prev_text' => __( '«' ),
                        'next_text' => __( '»' ),
                        'type' => 'list'
                        ) );
                    }
                        endif;
                    ?>
    
                      
                    <?php 
                         $paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1; 
                         $args = array(
                             'post_status' => 'publish',
                             'orderby' => 'publish_date',
                             'order' => 'DESC',
                             'paged' => $paged,
                             'posts_per_page' => 12
                    );
                         
                          
                    
                    $loop = new WP_Query( $args );
                         
                         if ( $loop->have_posts() ) :
                         while ( $loop->have_posts() ) : 
                        
                        ?>
                          
                         <div class="post">
                             
                             <div class="post-thumb">
                                  <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?>
                                  <img src="<?php echo $image[0]; ?>" alt="" />
                              </div>
                             
                             <h2 class="post-title-teaser"><?php the_title(); ?></h2>
                             
                             <div class="post-date-preview"><p><?php echo get_the_date(); ?></p></div>

                               
                             <div class="post-excerpt"><?php
                             the_excerpt(); ?></div>
                             
                             
                
                            <div class="elc-button post-button"><a class="read-on elc-button" aria-label="read more of the article about '<?php the_title(); ?>'" href="<?php the_permalink() ?>">Read More</a></div>
    
                                 
                            
                             
                         </div>
                           
                          
                         <?php 
                         // Repeat the process and reset once it hits the limit
                         endwhile;
                         
                         pagination( $paged, $loop->max_num_pages); // Pagination Function
                         
                         endif;

                         wp_reset_postdata();
                         ?>
                         
                    </div>   
                 
        
    </div>
    

</section>  

The truth is I didn’t know if the initial portion (the if function) should be part of the PHP template or in functions PHP but I tried both

I have also tried this

<div class="the-posts">
                        
                        
                        <?php 
                        // WP_Query arguments
                        $paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1;
                        $args = array(
                        'post_status'            => array( 'publish' ),
                        'nopaging'               => false,
                        'posts_per_page'         => '9',
                        'order'                  => 'DESC',
                        'orderby'                => 'date',
                        'paged' => $paged
                        );
                        
                        // The Query
                        $query = new WP_Query( $args );
                        
                        // The Loop
                        if ( $query->have_posts() ) {
                            while ( $query->have_posts() ) { ?>
                            
                            
                            
                            <div class="post">
                                 
                                 <div class="post-thumb">
                                      <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?>
                                      <img src="<?php echo $image[0]; ?>" alt="" />
                                  </div>
                                 
                                 <h2 class="post-title-teaser"><?php the_title(); ?></h2>
                                 
                                 <div class="post-date-preview"><p><?php echo get_the_date(); ?></p></div>
                            
                                   
                                 <div class="post-excerpt"><?php
                                 the_excerpt(); ?></div>
                                 
                                 
                            
                                <div class="elc-button post-button"><a class="read-on elc-button" aria-label="read more of the article about '<?php the_title(); ?>'" href="<?php the_permalink() ?>">Read More</a></div>
                            
                
                                 
                             </div>
                            
                                
                                
                                
                                
                                
                                <?php }
                            } else {
                            // no posts found
                            }
                        
                            echo paginate_links( array(
                                'base'         => str_replace( 999999999, '%#%', esc_url( get_pagenum_link( 999999999 ) ) ),
                                'total'        => $query->max_num_pages,
                                'current'      => max( 1, get_query_var( 'paged' ) ),
                                'format'       => '?paged=%#%',
                                'show_all'     => false,
                                'type'         => 'plain',
                        
                            ) );
                        // Restore original Post Data
                        wp_reset_postdata();
                        
                        ?>
</div>

                         
 

But the page won’t load and eventually, I get a 503

This kind of thing isn’t my forte so I tried all the examples but nothing seemed to work

Any help would be greatly appreciated

2

Answers


  1. Chosen as BEST ANSWER

    Okay so after trying for days, I actually got it working not long after posting this like so

    <section id="blog-posts" class="latest-blog-posts full-width standard-padding">
        
        <div class="full-width-inner">
        
        
        <div class="the-posts">
                <?php
                $paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1;
                
                $args = array(
                'posts_per_page' => 6,
                'paged' => $paged
                );
                
                $custom_query = new WP_Query( $args );
                
                while($custom_query->have_posts()) : 
                $custom_query->the_post();  
                ?>
                        <div class="post">
                            
                            <div class="post-thumb">
                                <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?>
                                <img src="<?php echo $image[0]; ?>" alt="" />
                            </div>
                            
                            <h2 class="post-title-teaser"><?php the_title(); ?></h2>
                            
                            <div class="post-date-preview"><p><?php echo get_the_date(); ?></p></div>
                        
                                
                            <div class="post-excerpt"><?php
                            the_excerpt(); ?></div>
                            
                            
                        
                            <div class="elc-button post-button"><a class="read-on elc-button" aria-label="read more of the article about '<?php the_title(); ?>'" href="<?php the_permalink() ?>">Read More</a></div>
                        
                
                            
                        </div>
                                                            
                    <?php endwhile; ?>      
                </div>
                
                
                
                
                <?php if (function_exists("pagination")) {
                    pagination($custom_query->max_num_pages);
                } ?> 
           
        </div>
           
                    
            
        </div>
        
    
    </section>  
    

    Functions.php

    // numbered pagination
    function pagination($pages = '', $range = 4)
    {  
         $showitems = ($range * 2)+1;  
     
         global $paged;
         if(empty($paged)) $paged = 1;
     
         if($pages == '')
         {
             global $wp_query;
             $pages = $wp_query->max_num_pages;
             if(!$pages)
             {
                 $pages = 1;
             }
         }   
     
         if(1 != $pages)
         {
             echo "<div class="pagination">";
             if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo "<a href='".get_pagenum_link(1)."'>&laquo; First</a>";
             if($paged > 1 && $showitems < $pages) echo "<a href='".get_pagenum_link($paged - 1)."'>&lsaquo; Previous</a>";
     
             for ($i=1; $i <= $pages; $i++)
             {
                 if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems ))
                 {
                     echo ($paged == $i)? "<span class="current">".$i."</span>":"<a href='".get_pagenum_link($i)."' class="inactive">".$i."</a>";
                 }
             }
     
             if ($paged < $pages && $showitems < $pages) echo "<a href="".get_pagenum_link($paged + 1)."">Next &rsaquo;</a>";  
             if ($paged < $pages-1 &&  $paged+$range-1 < $pages && $showitems < $pages) echo "<a href='".get_pagenum_link($pages)."'>Last &raquo;</a>";
             echo "</div>n";
         }
    }
    

    Thanks to this article

    https://www.evan-herman.com/how-to-add-numeric-wordpress-pagination/#.Yxy4S-zML2I


  2. need to check the PHP error log details for help, also you can comments out the template part by part, to find out the error happen on which part exactly.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search