Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I've been developing a theme which uses the load more ajax plugin, everything is setup and working great with the main query.

But, once I setup a new query for popular posts, the load more posts navigation for the popular posts loads the next posts of the main query. Any way to make it load the next posts page of the popular posts instead?

Here is the index file:

<?php get_header(); ?>

    <div id="blog">
      <h2 class="recent-head">Recent Posts</h2>
        <div class="recent-home-posts">
          <?php $paged = (get_query_var('paged')) ? (int) get_query_var('paged') : 1;
          $my_query = new WP_Query( array( 'posts_per_page' => 2, 'paged' => $paged ) );
while ( $my_query->have_posts() ) : $my_query->the_post(); ?>
            <div class="post clearfix">
              <div class="thumb">
                <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('home-thumb'); ?></a>
                  <span class="cat"><?php the_category(' ') ?></span>
                  <span class="comme"><?php comments_popup_link('0', '1', '%'); ?></span>
              </div>
              <div class="entry">   
                  <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                  <span class="time"><?php the_time('d,F,Y'); ?></span>
                   <p><?php echo excerpt(40); ?></p>
                  <a class="read-more" href="<?php the_permalink(); ?>">Read More</a>
              </div>
            </div>
            <?php endwhile;?>
            <?php include( TEMPLATEPATH . '/load-more.php' );?>
        </div>

      <h2 class="recent-head">Popular Posts</h2>
        <div class="top-home-posts clearfix">
        <div class="topwrap">
<?php 
$paged = (get_query_var('paged')) ? (int) get_query_var('paged') : 1;
$popularpost = new WP_Query( array( 'posts_per_page' => 3, 'orderby' => 'comment_count', 'paged' => $paged  ) );
while ( $popularpost->have_posts() ) : $popularpost->the_post();  ?>
                <div class="top-post">
                    <div class="top-thumb">
                      <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('popular-thumb'); ?></a>
                        <span class="cat"><?php the_category(' ') ?></span>
                        <span class="comme"><?php comments_popup_link('0', '1', '%'); ?></span>
                    </div>
                    <div class="top-entry"> 
                      <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                        <span class="time"><?php the_time('d,F,Y'); ?></span>
                        <p><?php echo excerpt(20); ?></p>
                        <a class="read-more" href="<?php the_permalink(); ?>">Read More</a>
                    </div>
                </div>
                  <?php endwhile; ?>
            <div class="break"></div>
<div class="navigation-top">
    <?php next_posts_link('Older &raquo;') ?>
</div>
        </div>
        </div>
    </div>
<?php get_sidebar(); ?> 
<?php get_footer(); ?>

And this is the load more posts plugin code:

jQuery(document).ready(function($) {
        <?php 
$paged = (get_query_var('paged')) ? (int) get_query_var('paged') : 1;
$popularpost = new WP_Query( array( 'posts_per_page' => 3, 'orderby' => 'comment_count', 'paged' => $paged  ) );  ?>
var pbd_alp = {
        startPage: "1",
        maxPages: "<?php echo $popularpost->max_num_pages; ?>",
        nextLink: "<?php bloginfo('url'); ?>/page/2/"
};
    var pageNum = parseInt(pbd_alp.startPage) + 1;

    // The maximum number of pages the current query can return.
    var max = parseInt(pbd_alp.maxPages);

    // The link of the next page of posts.
    var nextLink = pbd_alp.nextLink;

    /**
     * Replace the traditional navigation with our own,
     * but only if there is at least one page of new posts to load.
     */
    if(pageNum <= max) {
        // Insert the "More Posts" link.
        $('.top-home-posts')
            .append('<div class="more-top-posts-page-'+ pageNum +'"></div>')
            .append('<div id="load-more-top"><a href="#">Load More Posts</a></div>');

        // Remove the traditional navigation.
        $('.navigation-top a').remove();
    }


    /**
     * Load new posts when the link is clicked.
     */
    $('#load-more-top a').click(function() {

        // Are there more posts to load?
        if(pageNum <= max) {

            // Show that we're working.
            $(this).text('Loading posts...');

            $('.more-top-posts-page-'+ pageNum).load(nextLink + ' .post',
                function() {
                    // Update page number and nextLink.
                    pageNum++;
                    nextLink = nextLink.replace(/\/page\/[0-9]?/, '/page/'+ pageNum);

                    // Add a new placeholder, for when user clicks again.
                    $('#load-more-top')
                        .before('<div class="more-top-posts-page-'+ pageNum +'"></div>')

                    // Update the button message.
                    if(pageNum <= max) {
                        $('#load-more-top a').text('Load More Posts');
                    } else {
                        $('#load-more-top a').text('No more posts to load.');
                    }
                }
            );
        } else {
            $('#load-more-top a').append('.');
        }   

        return false;
    });
});

Any help/advice is appreciated, thank you.

share|improve this question
add comment

1 Answer 1

Looks like you're not resetting your query, so WordPress is running a new query on the posts you already got.

After your first query add:

wp_reset_query();

Always reset after any query that isn't The Loop.

Here's the codex page on it: http://codex.wordpress.org/Function_Reference/wp_reset_query

share|improve this answer
1  
Not exactly. wp_reset_query is needed when you replace the main query. When you use new instances of WP_Query, like OP, wp_reset_query is not needed. In this case you should call wp_reset_postdata because a call to $query->the_post() will overwrite global $post variable. From the codex, at the link you provide, you can read (bold mine): "This function should be called after query_posts()" Note after query_posts, not after any query that isn't The Loop as you said. In short, sorry, but this answer is wrong. –  G. M. Aug 23 '13 at 2:37
    
d'oh! Good call –  AJ Zane Aug 25 '13 at 1:23
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.