WordPress – Multiple WP_Query Custom Loop Paginations

by on March 30, 2012 in
WordPress – Multiple WP_Query Custom Loop Paginations Difficulty Level: Intermediate
 

WP_Query and pagination is kinda tricky. The catch is in fetching the page number from the URL and feeding it to your loop so it knows what posts to display.

In this tutorial, you’ll see a method for doing just that to add as many WP_Query custom loops as you want… and make them functional on the same page.

Download Video

Grab the Snippet

$paged1 = isset( $_GET['paged1'] ) ? (int) $_GET['paged1'] : 1;
$args1 = array(
    'paged'          => $paged1,
    'posts_per_page' => 2,
    'category_name'  => 'dogs'
);
$query1 = new WP_Query( $args1 );

while ( $query1->have_posts() ) : $query1->the_post();
    the_title();
    echo '<br>';
    the_category(' ');
    the_excerpt();
    echo '<hr>';
endwhile;

$pag_args1 = array(
    'format'   => '?paged1=%#%',
    'current'  => $paged1,
    'total'    => $query1->max_num_pages,
    'add_args' => array( 'paged1' => $paged1 )
);
echo paginate_links( $pag_args1 );

Download the Example Theme

In the next tutorial, I’ll show you how to add jQuery AJAX to make this incredibly smooth.

Additional Resources

Good Guy Boone’s personal website
How to Use WP_Query to Create Custom Loops in WordPress
WP Codex – paginate_links

 
If you liked this article, you might also like:
  • Denis Bastarache

    Like you I’ve been digging to resolving this issue for a few days now… I’ve replicated exactly what you have (http://denisbastarache.com/) so that I can finally get this working, using default permalinks, so on and so forth, and can’t for the life me figure out why this still isn’t working… seems so simple, yet even when forcing the paged parameter in my URL (?paged1=2), the pagination still won’t display… kind of a newbie to wordpress, so any help would be greatly appreciated! 

    • http://pressedweb.com/ Cory

      Are you echo’ing the paginate_links() function? If you’re doing that, it should display -some- kind of pagination for better or worse.

      Can you paste your exact code? 
      Try downloading the example theme above to make sure you didn’t make any typos.

      • Denis Bastarache

        Thanks for the response…. Here’s the exact code… I’m also outputting the query args for debug purposes… I did use your index.php and remove the second instance of the post loop so I could just work with one of them…  Here’s the code, hopefully it’ll display properly, if not I can email you the file… if I inspect the source in chrome, I see the div for the nav, but nothing’s coming up… I have the latest version of WP also…  

        $paged1, 
            ‘posts_per_page’ => 2,
            ‘category_name’  => ‘TESTING’
            );
                        
        $query1 = new WP_Query( $args1 );
        ?>

        have_posts() ) : $query1->the_post();
                            the_title();
                            echo ”;
                            the_category(‘ ‘);
                            the_excerpt();
                            echo ”;
                        endwhile;
        ?>

        ‘?paged1=%#%’,
                         ’current’  => $paged1,
                         ’total’    => $query1->max_num_pages
                       );
                        
        echo paginate_links( $pag_args1 );
        ?>

        • Denis Bastarache

          My paste didn’t work properly….  sorry… replacing normal brackets with square ones… you can delete the previous comment…

          [?   $paged1 = isset( $_GET['paged1'] ) ? (int) $_GET['paged1'] : 1;                $args1 = array(                    ‘paged’  => $paged1,                     ‘posts_per_page’ => 2,                    ‘category_name’  => ‘TESTING’              );                   $query1 = new WP_Query( $args1 );?] [?  while ( $query1->have_posts() ) : $query1->the_post();                    the_title();                    echo '';                    the_category(' ');                    the_excerpt();                    echo '';                endwhile;?] [?             $pag_args1 = array(             'format'   => '?paged1=%#%',             'current'  => $paged1,             'total'    => $query1->max_num_pages               );                echo paginate_links( $pag_args1 );?]

          • http://pressedweb.com/ Cory

            Sorry, could you just Copy/Paste the correct code to 
            http://paste.pocoo.org or a similar service?

          • Denis Bastarache

            Here’s the full code: http://paste.pocoo.org/show/581895/

          • http://pressedweb.com/ Cory

            You’re missing ’add_args’ => array( ‘paged1′ => $paged1 ) from $pag_args1. Also, try using “testing” instead of “TESTING” as your category name (WordPress uses the slug, not the actual name of your category 
            http://codex.wordpress.org/Class_Reference/WP_Query#Category_Parameters).

            In times like this, I’ve found directly copying the code and testing it first works great. Then slowly add and remove bits until something breaks – then you’ll know exactly what went wrong where.

          • Denis Bastarache

            Thanks so much for taking the time to help!  So I think I found the underlying issue, to be safe, I’m passing the categoryID now, just so I’m convinced it’s not query that’s wrong, so I added the addition array param like you indicated and I added an output of the values directly in the function to see what was coming through, where I noticed the “total” kept showing the default value, so went back to echo the “$query1->max_num_pages”, which appears to be the cause because if I pass a hardcoded value, like 3, the pagination displays just fine, but somehow the count from my query is always showing 0, but then if force the page numbers in the URL from 1 to 3 (http://denisbastarache.com/?paged1=2), it seems to be fetching the other pages just fine…. should the query based on my category pull “all” the full count?   Here’s the latest code:
            http://paste.pocoo.org/show/581975/

          • http://pressedweb.com/ Cory

            Out of curiosity, have you tried directly copy/pasting the exact code I have above?

            Also, you might want to check out the format parameter and your permalink structure: http://codex.wordpress.org/Function_Reference/paginate_links#Parameters

          • http://www.facebook.com/themediakid Javier Carmona

            Thank you Cory, i just wonder if you have done this tutorial with jquery. i was looking for it and i couldn’t find nothing like this with jquery.

            if you can put some links for resource would be very helpfull thank you in advance for your help

      • Denis Bastarache

        Can’t seem to reply to your below comment, but yes, I did use the file provided for download in the link above initially to test.. The only difference was the category I was pulling, which I then just switched to use “cat” param instead of category name.  I don’t think it’s an issue with “pagination” at this point, I just need to figure out why  max_num_pages ?> is returning 0 because as soon as I force the “total” to number great than 1, the pagination comes up, so it has to be something with the results my query is pulling, at least that’s what I’m led to believe at this point… What’s the best way to debug this?

        • http://pressedweb.com/ Cory

          Sorry about the threaded comment stuff, still messing with the layout of these comments and saw that our deeply threaded …thread was leaving our comments about 1-inch wide. Should be able to reply to the last “replyable” comment and it will toss the comment under the rest.

          Anywho… So did it work when you directly copy/pasted the code above?

        • Denis Bastarache

          Nope, couldn’t get it to work regardless of what I tried, are there alternatives to getting the total post count from wp_query (http://codex.wordpress.org/Class_Reference/WP_Query#Properties) other than max_num_pages that could at least give me some indication as to why my total number of posts isn’t coming up?   As soon as I can get that count and pass it to the “total” for the paginate_links(),  I think that will be my answer…. would the “post_per_page” force the total count to what I have?  I checked the permalinks and they’re set to default at the moment, so typical URL param concatenation works fine (?paged1=2).

        • Denis Bastarache

          Found my answers!!! – I guess it’s a known bug, but yeah, changed this attribute in the php.ini of the server and the page count from “max_page_num” finally came up, works!! NOTE TO SELF:
          mysql.trace_mode = Off;

        • http://pressedweb.com/ Cory

          I swear I was thinking it was something to do with server configuration but didn’t want to say anything until I was sure we had the same exact code running. :)

          Kudos on solving your own problem though. Typically if the same exact code is being ran on two different machines and it’s not working exactly the same, it’s server config crap.

  • raisononline

    Did you ever create the jQuery AJAX tutorial you mention?

    Cheers

  • raisononline

    I have a strange issue with this code which means the first link in the pagination is always the same as the current link. If you have any ideas why this is It would great to get some feedback on my stackoverflow which outlines the issue in a little more detail – thanks:

    http://stackoverflow.com/questions/20526711/wordpress-paginate-links-first-page-always-the-same-as-current-page

  • http://www.FearNotStudios.com Travis Phillips

    I’m using a custom permalink structure (/%category%/%postname%/) and the above code wouldn’t work it. I found that adding this line:
    ‘base’ => @add_query_arg(‘paged1′,’%#%’),

    to “$pag_args1 = array( )” and also to “$pag_args2 = array( )” – changing the paged1 to paged2 for the pag_args2 variable, fixed the problem.

    I hope this helps somebody out there.

    Now if only I can figure out how to load it via ajax so it doesn’t jump to the top of the page every time you click on a new page number. I’m looking forward to that tutorial!