WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Multiple loops in chronological order (8 posts)

  1. Dylan277
    Member
    Posted 9 months ago #

    What I'm trying to do, in simplest terms, is feature the 4 most recent posts on the index page, under that I have a graphic element. Under the graphic I'd like to feature the next 12 posts and the user would access the remaining posts in the next page(s).

    I was able to accomplish the first bit using 'showposts=4'. Obviously I don't want to repeat the first 4 posts in the second loop and I was able to make sure that wasn't a problem using 'post__not_in'. However, I'm having a problem getting the second loop to show only 12 posts.

    Here's the code:

    1st loop:
    <?php query_posts('showposts=4'); $ids = array(); while (have_posts()) : the_post(); $ids[] = get_the_ID();?>

    2nd loop:
    <?php query_posts(array('post__not_in' => $ids,)); while (have_posts()) : the_post(); ?>

    I'm not sure the way I'm doing is the most effective way, as I've learned the above from searching the internet (and I can't write code very well). I feel like this should be an easy fix, it just seems to be out of my scope of understanding. I hope I'm being clear here.

    Any and all help would greatly appreciated, thanks in advance!

  2. Fabiana Simões
    Member
    Posted 9 months ago #

    Hey there,

    You can try something like:

    query_posts( array( 'posts_per_page' => 12, 'offset' => 4 ) );

    That should give you the 12 posts which follow the 4 most recent ones.

  3. Dylan277
    Member
    Posted 8 months ago #

    Hmmm, it doesn't seem to be working. I'm getting an error related to closing the second loop. Here's a simplified version of what I have:

    <?php query_posts('showposts=4'); $ids = array(); while (have_posts()) : the_post(); $ids[] = get_the_ID();?>
    
    <div class="subfeature">
      <!-- First Set of Posts -->
    </div><!--subfeature-->
    
    <?php endwhile; ?>
    
    <div class="printedcont">
      <!-- Graphic Element -->
    </div><!--printedcont-->
    
    <?php query_posts( array( 'posts_per_page' => 12, 'offset' => 4 ) ); ?>
    
    <div class="subfeature">
      <!-- Second Set of Posts -->
    </div><!--subfeature-->
    
    <?php endwhile; endif; ?>

    What am I doing wrong here?

  4. keesiemeijer
    moderator
    Posted 8 months ago #

    Do you want this on paginated pages as well? If so you could just use a single loop similar to this.

    <?php
    // get the paged value for the query
    $paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1;
    $args = array(
        'posts_per_page' => 16,
        'paged' => $paged
    );
    
    // the query
    $the_query = new WP_Query( $args );
    ?>
    
    <?php if ( $the_query->have_posts() ) : ?>
    
    <?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
    
    <div class="subfeature">
      <!-- First Set of Posts -->
    </div><!--subfeature-->
    
    <?php
        //  Show graphic elements after fourth post.
        //  starts with 0. (3 is fourth post)
        if ( $wp_query->current_post == 3 ) : ?>
    
    <div class="printedcont">
      <!-- Graphic Element -->
    </div><!--printedcont-->
    
    <?php endif; ?>
    
    <?php endwhile; ?>
    
    <?php
    // example how to use next_posts_link() pagination function with a custom query using new WP_Query()
    next_posts_link( 'Older Entries', $the_query->max_num_pages );
    previous_posts_link( 'Newer Entries' );
    ?>
    
    <?php wp_reset_postdata(); ?>
    <?php else:  ?>
    <p><?php _e( 'Sorry, no posts matched your criteria.' ); ?></p>
    <?php endif; ?>

    Setting the offset parameter overrides/ignores the paged parameter and breaks pagination.
    http://codex.wordpress.org/Function_Reference/WP_Query#Pagination_Parameters

  5. Dylan277
    Member
    Posted 8 months ago #

    Keesiemeijer,
    That didn't work for me. I removed the second loop and placed your code in the way I assumed it should be, but no luck. :/

    The graphic element is completely gone. The code is still there, but it's not showing up when I load the page. I'm just getting 12 post on the front.

    Here is nearly all of the page code, the code directly below is located right under the get_header tag.

    <?php
    // get the paged value for the query
    $paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1;
    $args = array(
        'posts_per_page' => 16,
        'paged' => $paged
    );
    
    // the query
    $the_query = new WP_Query( $args );
    ?>

    FULL CODE:

    <div id="widecolumn">
    
    <?php if ( $the_query->have_posts() ) : ?>
    <?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
    
    <div class="subfeature">
    
    	<div class="categorycont">
    		<div class="postcategory">
    			<span class="comcat"><?php the_category(', ') ?></span>
    		</div><!--postcategory-->
    	</div><!--categorycont-->
    
    	<div class="commentcont">
    		<div class="postcomments">
    			<span class="comcat"><?php comments_popup_link('0', '1', '%'); ?></span>
    		</div><!--postcomments-->
    	</div><!--commentcont-->
    
    	<div class="post_thumb">
    		<?php if ( has_post_thumbnail()) the_post_thumbnail('home-thumb'); ?>
    		<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><div class="overlay"></div><!--overlay--></a>
    	</div><!--post_thumb-->
    
    	<div class="excerptcontainer">
     	<div class="titlecontainer">
    		<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a>
    	</div><!--titlecontainer-->
    
    	<div class="excerpt">
    		<?php $myExcerpt = get_the_excerpt(); $tags = array("<p>", "</p>"); echo substr(get_the_excerpt(), 0,90); ?>
    	</div><!--excerpt-->
    
    	</div><!--excerptcontainer-->
    
    </div><!--subfeature-->
    
    <?php
        //  Show graphic elements after fourth post.
        //  starts with 0. (3 is fourth post)
        if ( $wp_query->current_post == 3 ) : ?>
    
    <div class="printedbanner">
    	<div class="printissues">PRINT ISSUES</div><!--printissues--><div class="seeall">SEE ALL</div><!--seeall-->
    </div><!--printedbanner-->
    
    <div class="printedcont">
    
    	<div class="issueprint1">
    <div id="issuebox" class="issuebox">
            <img id="image-3" src="http://paracinema.net/images/test/lg20.jpg"/>
            <span class="caption fade-caption"><h8>ISSUE <br>20</h8></span>
    </div><!--issuebox-->
    	</div><!--issueprint1-->
    
    	<div class="issueprint2">
    <div id="issuebox" class="issuebox">
            <img id="image-3" src="http://paracinema.net/images/test/lg19.jpg"/>
            <span class="caption fade-caption"><h8>ISSUE <br>19</h8></span>
    </div><!--issuebox-->
    	</div><!--issueprint2-->
    
    	<div class="issueprint3">
    <div id="issuebox" class="issuebox">
            <img id="image-3" src="http://paracinema.net/images/test/lg18.jpg"/>
            <span class="caption fade-caption"><h8>ISSUE <br>18</h8></span>
    </div><!--issuebox-->
    	</div><!--issueprint3-->
    
    </div><!--printedcont-->
    
    <?php endif; ?>
    <?php endwhile; ?>
    
            <div class="navigation">
            <div class="navigation_text">
    
            <?php
    // example how to use next_posts_link() pagination function with a custom query using new WP_Query()
    next_posts_link( 'Older Entries', $the_query->max_num_pages );
    previous_posts_link( 'Newer Entries' );
    ?>
    
            </div><!--navigation_text-->
            </div><!--navigation-->
    
            <?php wp_reset_postdata(); ?>
    <?php else:  ?>
    <p><?php _e( 'Sorry, no posts matched your criteria.' ); ?></p>
    <?php endif; ?>
    
    	</div><!--widecolumn-->
  6. keesiemeijer
    moderator
    Posted 8 months ago #

    Oops,try changing this:

    if ( $wp_query->current_post == 3 ) : ?>

    to this:

    if ( $the_query->current_post == 3 ) : ?>
  7. Dylan277
    Member
    Posted 8 months ago #

    Thanks Keesiemeijer! That did it.

  8. Dylan277
    Member
    Posted 8 months ago #

    Thanks to Fabianapsimoes as well, all the help is much appreciated.

Reply

You must log in to post.

About this Topic