• Hey there,

    I try to create my first own WordPress theme and I got a problem because I want to show the current page the user is on and a forward/backward link at the bottom. The result should look like this: https://prnt.sc/b3xgq1

    I’m using this loop:

    <main id="main">
    
    			<?php
                // the query
                $args = array('posts_per_page' => 2 );
                $the_query = new WP_Query( $args ); 
    
                ?>
    
                <?php if ( $the_query->have_posts() ) { ?>
    
                    <!-- loop -->
    
                    <?php while ( $the_query->have_posts() ) {
    
                                $the_query->the_post(); ?>
           <article id="post"> 
    
                        <div id="thumbnail">
    
    						<?php
    						if ( has_post_thumbnail() ) {
    							 the_post_thumbnail(); } ?>
    
                    </div>
    
                   <h2><a href="<?php the_permalink();?>"><?php the_title(); ?></a></h2>
    
                   <div class="entry">
    
                        <?php the_excerpt(); ?>
    
                   </div>
    
           </article>
    
                <?php } } else { ?>
                <p><?php _e( 'Die Posts entsprechen nicht den Kriterien.' ); ?></p>
                <?php }  ?>
    
               <!-- end of the loop -->
    
               <?php wp_reset_postdata(); ?>
    
               <div id="pagination"></div>
    
        </main>

    I hope that someone explain me how to do this.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The WordPress Codex is a priceless resource – and a quick google search for WordPress functions generally turns up the correct Codex page as a first result. If not, simply search the Codex itself.

    On this page, you’ll find exactly what you need:

    https://codex.www.ads-software.com/Pagination

    Scroll down and copy & paste the relevent bit from the example into your Theme.

    ??

    If you know php you can use “if” statement with wordpress max_num_pages to generate one, which provides you with complete flexibility for conditional execution
    i made something for you .. change the class “paged” with you own custom css
    i din`t test it .

    <main id="main">
    
    			<?php
                // the query
                $args = array('posts_per_page' => 2 );
                $the_query = new WP_Query( $args ); 
    
                ?>
    
                <?php if ( $the_query->have_posts() ) { ?>
    
                    <!-- loop -->
    
                    <?php while ( $the_query->have_posts() ) {
    
                                $the_query->the_post(); ?>
           <article id="post"> 
    
                        <div id="thumbnail">
    
    						<?php
    						if ( has_post_thumbnail() ) {
    							 the_post_thumbnail(); } ?>
    
                    </div>
    
                   <h2><a href="<?php the_permalink();?>"><?php the_title(); ?></a></h2>
    
                   <div class="entry">
    
                        <?php the_excerpt(); ?>
    
                   </div>
    
           </article>
    
                <?php } } else { ?>
                <p><?php _e( 'Die Posts entsprechen nicht den Kriterien.' ); ?></p>
                <?php }  ?>
    <!-- pagination -->
    			<?php
    if($the_query->max_num_pages>1){?>
        <p class="paged">
        <?php
          if ($paged > 1) { ?>
            <a href="<?php echo '?paged=' . ($paged -1); //prev link ?>"><</a>
                            <?php }
        for($i=1;$i<=$the_query->max_num_pages;$i++){?>
            <a href="<?php echo '?paged=' . $i; ?>" <?php echo ($paged==$i)? 'class="selected"':'';?>><?php echo $i;?></a>
            <?php
        }
        if($paged < $the_query->max_num_pages){?>
            <a href="<?php echo '?paged=' . ($paged + 1); //next link ?>">></a>
        <?php } ?>
        </p>
    <?php } ?>
    	<!--  end pagination -->		
    
               <!-- end of the loop -->
    
               <?php wp_reset_postdata(); ?>
    
               <div id="pagination"></div>  // take this off
    
        </main>
    Thread Starter hpbook

    (@hpbook)

    Thank you for your replies. I’m sorry but nothing works for me. The pagination is not displayed. What am I doing wrong?

    chance “$args = array(‘posts_per_page’ => 2 );” value 1

    or try this

    <main id="main">
    
    			<?php
                // the query
                $args = array('posts_per_page' => 1 );
                $the_query = new WP_Query( $args ); 
    
                ?>
    
                <?php if ( $the_query->have_posts() ) { ?>
    
                    <!-- loop -->
    
                    <?php while ( $the_query->have_posts() ) {
    
                                $the_query->the_post(); ?>
           <article id="post"> 
    
                        <div id="thumbnail">
    
    						<?php
    						if ( has_post_thumbnail() ) {
    							 the_post_thumbnail(); } ?>
    
                    </div>
    
                   <h2><a href="<?php the_permalink();?>"><?php the_title(); ?></a></h2>
    
                   <div class="entry">
    
                        <?php the_excerpt(); ?>
    
                   </div>
    
           </article>
    
                <?php } } else { ?>
                <p><?php _e( 'Die Posts entsprechen nicht den Kriterien.' ); ?></p>
                <?php }  ?>
    <!-- pagination -->
    <?php
    $pages = '';
    $range=2;
    	$showitems = ($range * 2)+1;  
    
         global $paged;
         if(empty($paged)) $paged = 1;
    
         if($pages == '')
         {
             global $the_query;
             $pages = $the_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;</a>";
             if($paged > 1 && $showitems < $pages) echo "<a href='".get_pagenum_link($paged - 1)."'>&lsaquo;</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)."'>&rsaquo;</a>";
             if ($paged < $pages-1 &&  $paged+$range-1 < $pages && $showitems < $pages) echo "<a href='".get_pagenum_link($pages)."'>&raquo;</a>";
             echo "</div>\n";
         }
    
    	 ?>
    	<!--  end pagination -->		
    
               <!-- end of the loop -->
    
               <?php wp_reset_postdata(); ?>
    
        </main>

    @zota marius – good catch on the posts_per_page, I missed that.

    However, that IMHO is a misnomer – it actually limits the results, not how many show on a page.

    https://codex.www.ads-software.com/Function_Reference/query_posts

    @hpbook – is this for an ‘archive’ (category) page? I notice you’re using the_excerpt instead of the_content….and if you’re limiting the results to only two posts, then WP will not display any pagination navigation links because there won’t be any more posts to show.

    What you can do is change that parameter from ‘2’ to ‘-1’ which means to return ALL posts (read the Codex link above on query_posts), then in your Settings>Reading change the “Blog pages show at most” setting to the desired number of posts you want shown on each page.

    When WP says (in this setting) “Blog pages” what it means is archive/category pages. SO if say you have 25 posts and you set that to show 5 posts per page, and you are returning all posts in your query (using -1) then your archive page will show 5 posts and some pagination below so that you can scroll through the pages.

    AND by the way, if you’re going to offer your Theme to anyone else, this is a better way to do this, because others may have a different preference for how many posts to show – you just want your query to return ALL the posts, and let them decide how many to show before the pagination kicks in. I would only recommend going through the hoops of crafting a lot of custom code to tightly control how many per page if it’s a Theme that only YOU will use.

    Thread Starter hpbook

    (@hpbook)

    Thank you for your answer! I just set the number to 2 because I have three posts right now. I just wanted to try it out.

    I’ll have a look and I’ll message you back ??

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘How to add pagination to my wordpress loop?’ is closed to new replies.