Specific Loop For 2 <div> Within Each <li>

0 Views

I need to create a loop that can logically be described as the following for a carousel:
Requirements:

  • 3 Loops
  • 2 Posts Per Loop
  • No Duplicates
  • Order by Post Date

Visual:

Read More
< Start Loop #1 >
< Post #1 >
< Post #2 >
< End Loop #1 >

< Start Loop #2 >
< Post #3 >
< Post #4 >
< End Loop #2 >

< Start Loop #3 >
< Post #5 >
< Post #6 >
< End Loop #3 >

Ideally, I would like a solution that could carry on infinite loops this way with no duplicates. I looked in the WP codex, but I could not find a specific solution that fit with my code shown here: http://pastebin.com/LitYb0wh

How can I make the loop to work with this type of structure? 

<ul>

<li>
<div>Post 1</div>
<div>Post 2</div>
</li>

<li>
<div>Post 3</div>
<div>Post 4</div>
</li>

<li>
<div>Post 5</div>
<div>Post 6</div>
</li>

</ul>
Post Views: 0

Related posts

Leave a Reply

2 comments

  1. i use this code in my portfolio http://pocketapps.co/

    enter image description here

    <?php $args = array(
                                    //your argument code
                                );
            query_posts($args);?>

            <ul>
                 <?php  
                 $ls=0;
                    while ( have_posts() ) : the_post(); 
            ?>
                    <?php if($ls%2==0): echo '</li><li>'; endif; ?>
                    <div class="app">
                            //your code here

                    </div>
             <?php 
                $ls++;
                endwhile;
                wp_reset_query();
             ?>
            </ul>

  2. To precisely match your three <ul> pattern you can do this:

    $my_query = new WP_Query();
$my_query->query($args);
$skip = 2;
echo '<ul>';
while ($my_query->have_posts()) {
  $my_query->the_post();
  echo '<li>'.$post->post_title.'</li>';
  if ( ( ($my_query->current_post-1) % $skip ) == 0) {
    break;
  }
}
echo '</ul>';
echo '<ul>';
while ($my_query->have_posts()) {
  $my_query->the_post();
  echo '<li>'.$post->post_title.'</li>';
  if ( ( ($my_query->current_post-1) % $skip ) == 0) {
    break;
  }
}
echo '</ul>';
echo '<ul>';
while ($my_query->have_posts()) {
  $my_query->the_post();
  echo '<li>'.$post->post_title.'</li>';
  if ( ( ($my_query->current_post-1) % $skip ) == 0) {
    break;
  }
}
echo '</ul>';

    However, the following it smaller, neater, and should create any number of <ul>s depending on the size of the query, which I assume is what you mean when you say “infinite loops this way”.

    $my_query = new WP_Query();
$my_query->query($args);
$skip = 2;
while ($my_query->have_posts()) {
  if ( ( ($my_query->current_post-1) % $skip ) == 0) {
    echo '<ul>';
  }
  $my_query->the_post();
  echo '<li>'.$post->post_title.'</li>';
  if ( ( ($my_query->current_post-1) % $skip ) == 0) {
    echo '</ul>';
  }
}

    An option using a single <ul>

    $my_query = new WP_Query();
$my_query->query($args);
$skip = 2;
echo '<ul>';
  while ($my_query->have_posts()) {
    if ( ( ($my_query->current_post-1) % $skip ) == 0) {
      echo '<li>';
    }
    $my_query->the_post();
    echo '<div>'.$post->post_title.'</div>';
    if ( ( ($my_query->current_post-1) % $skip ) == 0) {
      echo '</li>';
    }
  }
echo '</ul>';

    The $args I used to test is…

    $args = array(
  'post_type' => 'post',
  'post_status' => 'publish',
  'posts_per_page' => 8,
  'order' => 'ASC',
);

    … but this should work with any that your provide.

    It does assume that you don’t want to query for a distinct set of posts for each Loop.

    Obviously, I did not work this into your existing code but the pattern should be easy to apply.