CODEWITHSUNDEEP
phphtmlwordpresspagination
Damir
Damir

Reputation: 342

Using paginate links on post archive page

I would like to use paginate links on my archive page where I list all the posts from the website.

I would like to show only 10 posts per page and in the bottom to have OLDER POSTS link to display older posts on next page.

I tried adding pagginate function at the end but nothing shows up to me in the front end so I must be doing something wrong.

My current code looks like this:

    <div class="container">
        <div class="content col-md-9">
            <div class="home-content">          

                <!-- Show posts -->
                <?php $posts = get_posts(array('category'=>'', 'posts_per_page'=>10)); ?>
                <?php if($posts) { ?>
                <?php foreach ($posts as $post) { setup_postdata($post); ?>
                <div style="float:left; margin:1%;">
                <?php 
                if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
                    the_post_thumbnail( 'thumbnail', array( 'class' => 'img-post')); // show featured image
                }

                ?>
                </div>
                <h1 class="post-thumb"><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1>
                <h4>Category: <?php the_category(', '); ?></h4>
                <p><?php the_excerpt(); ?></p>
                <hr style="margin-bottom:5%">
                <?php } wp_reset_postdata(); ?>
                <?php } else { ?>
                <p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
                <?php } ?>
                <?php if (function_exists("emm_paginate")) {
                    emm_paginate();
                } ?>

            </div>
        </div>
        <div class="col-md-3 sidebar unstyled">
                <?php dynamic_sidebar( 'home1' );   ?>
        </div>
        <div class="col-md-3 sidebar unstyled sidebar-space">
                <?php dynamic_sidebar( 'home2' );   ?>
        </div>
        <div class="col-md-3 sidebar unstyled sidebar-space">
                <?php dynamic_sidebar( 'articles1' );   ?>
        </div>

        </div>
    </div>
</body>

Upvotes: 1

Views: 2868

Answers (1)

nunorbatista
nunorbatista

Reputation: 875

Please take a look at Wordpress Codex has they have extensive documentation on Pagination, specifically this page: http://codex.wordpress.org/Pagination and the Wp_Query, Pagination section here: http://codex.wordpress.org/Class_Reference/WP_Query#Pagination_Parameters

Your correct paginated loop should look like this:

<?php 
// the query to set the posts per page to 10
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array('posts_per_page' => 10, 'paged' => $paged );
query_posts($args); ?>
<!-- the loop -->
<?php if ( have_posts() ) : while (have_posts()) : the_post(); ?>
        <!-- rest of the loop -->
        <!-- the title, the content etc.. -->
<?php endwhile; ?>
<!-- pagination -->
<?php next_posts_link(); ?>
<?php previous_posts_link(); ?>
<?php else : ?>
<!-- No posts found -->
<?php endif; ?>

There is the need to add the $paged var to the query and also I don't know where you got the emm_paginate(); function, just stick to the Wordpress code to do the job and after it's working, customize it.

EDIT: Matched requested code

You were using get_posts, which is good if you want a simple query of posts but kind of messy when you need pagination. For the purpose, it's better to use query_posts, as the example code I gave.

So, I've corrected the args of the query (category was empty and added the $paged parameter).

<div class="container">
        <div class="content col-md-9">
            <div class="home-content">          

                <!-- Show posts -->
                <?php 

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

                    $args = array(
                            'paged'=> $paged, 
                            'posts_per_page'=> 10
                        );

                        query_posts($args); ?>

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

                    <div style="float:left; margin:1%;">
                    <?php 
                    if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
                        the_post_thumbnail( 'thumbnail', array( 'class' => 'img-post')); // show featured image
                    }

                    ?>
                    </div>
                    <h1 class="post-thumb"><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1>
                    <h4>Category: <?php the_category(', '); ?></h4>
                    <p><?php the_excerpt(); ?></p>
                    <hr style="margin-bottom:5%">
                    <?php endwhile; ?>
                    <!-- pagination -->
                    <?php next_posts_link(); ?>
                    <?php previous_posts_link(); ?>
                    <?php else : ?>
                       <p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
                    <?php endif; ?>

            </div>
        </div>

        <div class="col-md-3 sidebar unstyled">
                <?php dynamic_sidebar( 'home1' );   ?>
        </div>
        <div class="col-md-3 sidebar unstyled sidebar-space">
                <?php dynamic_sidebar( 'home2' );   ?>
        </div>
        <div class="col-md-3 sidebar unstyled sidebar-space">
                <?php dynamic_sidebar( 'articles1' );   ?>
        </div>

</div>

You can now use other pagination functions with numbers, for example, if you want.

The code above was tested and is working.

Upvotes: 2

Related Questions