Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress

Chris Boyle
Chris Boyle
2,201 Points

Adding Pagination ability to content-post.php

Hi,

I have been trying to add pagination to the content-post.php we developed during the how to make a word press theme course, however as this is a loop it repeats the pagination after every post? Is it possible to have it just appear once at the bottom of say 5 posts?

I have been using this a guide for adding the pagination: http://adambalee.com/how-to-add-pagination-to-your-wordpress-blog-without-a-plugin/

Thanks for the help Chris

My content-post.php is below:

<section class="section group"> <div class="col span-2"></div> <div class="info-post col span-8">

        <!-- if displaying the full post - do ----------->
        <?php if(is_single()): ?>

            <div class="section group">
                <div class="col span-12">
                    <h3 class="full-post-title"><b>--><?php //the_title( ); ?><!--</b></h3>
                </div>
            </div>

        <?php comments_template(); ?>

        <?php else: ?>

            <!-- circle with date and time of post ----------->
            <div class="col span-2">    
                <div class="circle-text">
                    <div>
                           <span class="post-date"><?php the_time('M'); ?></span>
                           <br />
                           <span class="post-date-num"><?php the_time('j'); ?></span>
                    </div>
                </div>
            </div>

            <!-- container for the post content itself ----------->
            <div class="col span-9">    

            <!-- post the title ----------->
            <span class="post-title">
                <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
            </span>

            <hr />

            <!-- post the post meta data----------->
            <span class="post-meta">
                    <img src="<?php bloginfo('template_directory'); ?> /img/icon-man.svg" width="2.5%"></img>

                    By: <?php the_author_posts_link(); ?> 

                    <img src="<?php bloginfo('template_directory'); ?> /img/icon-cat.svg" width="2.5%"></img>

                    <?php the_category(', '); ?>   

                    <img src="<?php bloginfo('template_directory'); ?> /img/icon-com.svg" width="2.5%"></img>

                    <?php comments_number( 'no responses' ); ?>
            </span>

            <!-- post the post short content----------->
                <span class="post-excerpt"><?php the_excerpt(); ?></span>

                <img src="<?php bloginfo('template_directory'); ?> /img/icon-read.svg" width="2.5%"></img>
                <span class="post-link"> Read <a href="<?php the_permalink(); ?>">more...</a></span>
            </div>

        <?php endif; ?> 
    </div>

    <div class="col span-2"></div>

</section>

2 Answers

Zac Gordon
STAFF
Zac Gordon
Treehouse Guest Teacher

Hey Chris!

Sorry for the late response here.. it may be that you have to move your pagination code out of the while statement. If you take a look at the Codex example Loop for pagination you can see that they end the while statement before placing in the pagination code.

<?php if ( have_posts() ) : ?>

<!-- Add the pagination functions here. -->

<!-- Start of the main loop. -->
<?php while ( have_posts() ) : the_post();  ?>

<!-- the rest of your theme's main loop -->

<?php endwhile; ?>
<!-- End of the main loop -->

<!-- Add the pagination functions here. -->

<div class="nav-previous alignleft"><?php next_posts_link( 'Older posts' ); ?></div>
<div class="nav-next alignright"><?php previous_posts_link( 'Newer posts' ); ?></div>

<?php else : ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
<?php endif; ?>

I think we also need to see the code you're using for the main template (that is calling the content-post.php).

Chris Boyle
Chris Boyle
2,201 Points

Hi Zac,

Thank you for getting back to me. I might be getting it wrong, I think I am getting confused. Do I put the code for the pagination into the page template file for the blog page or in the content-post.php file as above?

Here is my custom page template that is used on the blog page.

Thanks again for the help, Zac :-)

<?php 

/*
Template Name: Blog Post Page
*/

get_header(); ?>

<div class="grid_12 omega clearfix">

<?php

$args = array(
'post_type' => 'post'
);

$the_query = new WP_Query( $args );

?>

<?php if ( have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?>

<section class="section group">
<div class="col span-2"></div>
<div class="col span-8">
<p align="center"><img src="<?php the_field( 'insurance_icon' ); ?>" width="20%"></img></p>
<h4 class="sub-title"><?php the_title( ); ?></h4> 
</div> 
</section>

<section class="section group">
<div class="col span-2"></div>
<div class="col span-8">
<p class="sub-title"><?php the_field( 'content' ); ?></p> 
</div> 
</section>

<?php endwhile; else: ?>

<!-- Add the pagination functions here. -->

<h1><?php next_posts_link( 'Older posts' ); ?></h1>
<h1><?php previous_posts_link( 'Newer posts' ); ?></h1>

<?php else : ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
<?php endif; ?>
</div>

<?php get_footer(); ?>