Wordpress boucle spéciale Html sortie

Question

Je suis en train d'obtenir une sortie html boucle spéciale wordpress:

<div id="main"> 

    <!-- Line number 1 --> 
    <div class="article-thumbnail" data-target="article-1" > 
     <div class="article-open"><img src="" /></div> 
    </div> 
    <div class="article-thumbnail" data-target="article-2" > 
     <div class="article-open"><img src="" /></div> 
    </div> 
    <div class="article-thumbnail" data-target="article-3" > 
     <div class="article-open"><img src="" /></div> 
    </div> 

    <div class="container"> 
     <article id="article-1" class="article-entry"> 
      <header class="article-header"> 
       <h2>This is the article 1 text</h2>  
      </header> 
      <div class="article-body"> 
       <p>This is the article 1 body</p>  
      </div> 
     </article> 
     <article id="article-2" class="article-entry"> 
      <header class="article-header"> 
       <h2>This is the article 2 text</h2>  
      </header> 
      <div class="article-body"> 
       <p>This is the article 2 body</p>  
      </div> 
     </article> 
     <article id="article-3" class="article-entry"> 
      <header class="article-header"> 
       <h2>This is the article 3 text</h2>  
      </header> 
      <div class="article-body"> 
       <p>This is the article 3 body</p>  
      </div> 
     </article> 
    </div> 


    <!-- Line number 2 --> 
    <div class="article-thumbnail" data-target="article-4" > 
     <div class="article-open"><img src="" /></div> 
    </div> 

    <div class="article-thumbnail" data-target="article-5" > 
     <div class="article-open"><img src="" /></div> 
    </div> 
    <div class="article-thumbnail" data-target="article-6" > 
     <div class="article-open"><img src="" /></div> 
    </div> 
    <div class="container"> 
     <article id="article-4" class="article-entry"> 
      <header class="article-header"> 
       <h2>This is the article 4 text</h2>  
      </header> 
      <div class="article-body"> 
       <p>This is the article 4 body</p>  
      </div> 
     </article> 
     <article id="article-5" class="article-entry"> 
      <header class="article-header"> 
       <h2>This is the article 5 text</h2>  
      </header> 
      <div class="article-body"> 
       <p>This is the article 5 body</p>  
      </div> 
     </article> 
     <article id="article-6" class="article-entry"> 
      <header class="article-header"> 
       <h2>This is the article 6 text</h2>  
      </header> 
      <div class="article-body"> 
       <p>This is the article 6 body</p>  
      </div> 
     </article> 
    </div> 
</div> 

Vérifiez ce fichier violon: http://jsfiddle.net/PkZrZ/5/ pour avoir une idée de ce que je suis en train de réaliser. Fondamentalement, ce que j'essaie d'obtenir de la boucle de Wordpress est 1 ligne de 3 vignettes (images de la poste en vedette) et en dessous de chaque entrée de poste pour chaque vignette, après une autre ligne et ainsi de suite.

J'ai réussi à réaliser quelque chose, mais pour être honnête, il est incroyablement bogué (une fois que cela a fonctionné, et par la suite il n'a pas fonctionné) et semble faux. Quoi qu'il en soit, voici la boucle Wordpress J'ai jusqu'à présent:

<?php 
$post_array = array(); 
$i = 0; 
$j = 0; 
$index = 0; 
$post_total = $wp_query->post_count; // buggy 
/*$post_total = get_term_by('name','ventures','category'); 
$post_total = $post_total->count;*/ 
// echo $post_total; 
if (have_posts()) : while (have_posts()) : the_post(); 
    $i++; 
    // echo $i; 
    $post_array[] = get_object_vars($post); 
?> 
    <div id="post-ventures-image-<?php the_ID();?>" class="post-ventures-image"> 
     <?php the_post_thumbnail('hnp-thumb-ventures-180'); ?> 
    </div> 

    <?php if($i%3 == 0 && $post_total >= 3) : ?> 
     <?php for($j = 0; $j < 3; $j++) : ?> 

      <article id="post-<?php echo $post_array[$index + $j]['ID'];//the_ID(); ?>" <?php post_class('clearfix'); ?> role="article"> 
       <header class="article-header"> 
        <h3 class="h2"><?php echo $post_array[$index + $j]['post_title'];//the_title(); ?></h3> 
       </header> <!-- end article header --> 
       <section class="entry-content clearfix"> 
        <?php echo $post_array[$index + $j]['post_content'];//the_content(); ?> 
       </section> <!-- end article section --> 
      </article> <!-- end article --> 

     <?php endfor; $index = $index + $j; $j = 0; $post_total = $post_total - 3; $i = 0; ?> 

    <?php elseif($i%2 == 0 && $post_total == 2) : ?> 
     <?php for($j = 0; $j < 2; $j++) : ?> 

      <article id="post-<?php echo $post_array[$index + $j]['ID'];//the_ID(); ?>" <?php post_class('clearfix'); ?> role="article"> 
       <header class="article-header"> 
        <h3 class="h2"><?php echo $post_array[$index + $j]['post_title'];//the_title(); ?></h3> 
       </header> <!-- end article header --> 
       <section class="entry-content clearfix"> 
        <?php echo $post_array[$index + $j]['post_content'];//the_content(); ?> 
       </section> <!-- end article section --> 
      </article> <!-- end article --> 

     <?php endfor; $index = $index + $j ; $j = 0; $post_total = $post_total - 2; $i = 0; ?> 

    <?php elseif($i%1 == 0 && $post_total == 1) : ?> 
     <?php for($j = 0; $j < 1; $j++) : ?> 

      <article id="post-<?php echo $post_array[$index + $j]['ID'];//the_ID(); ?>" <?php post_class('clearfix'); ?> role="article"> 
       <header class="article-header"> 
        <h3 class="h2"><?php echo $post_array[$index + $j]['post_title'];//the_title(); ?></h3> 
       </header> <!-- end article header --> 
       <section class="entry-content clearfix"> 
        <?php echo $post_array[$index + $j]['post_content'];//the_content(); ?> 
       </section> <!-- end article section --> 
      </article> <!-- end article --> 

     <?php endfor; $index = $index + $j + 1; $j = 0; $i = 0; ?> 

    <?php endif;?> 
    <?php endwhile; ?> 
    <?php endif; ?> 

Je pense qu'il est hors de discussion que ce codage jamais vu le pire improvisé. Si quelqu'un peut me écrire un balisage rapide sur la façon d'écrire la boucle qui serait gonfler :)

Answer 1

Mise à jour:

$posts = get_posts(); 
    $first_three = array_chunk($posts, 3); 
    $count = 0; 
    foreach($first_three as $posts){ 
     foreach($posts as $post){?> 
     <div class="article-thumbnail" data-target="article-1" > 
      <div class="article-open"><?php echo $post->post_title; ?></div> 
     </div><?php 
     }?> 
    <div class="container"><?php 
    foreach($posts as $post){$count++?> 
     <article id="article-<?php echo $count; ?>" class="article-entry"> 
      <header class="article-header"> 
       <h2>This is the article <?php echo $count; ?> text</h2>  
      </header> 
      <div class="article-body"> 
       <p>This is the article <?php echo $count; ?> body</p>  
      </div> 
     </article><?php 
    }?> 
    </div><?php 
    } 

fonctionne parfaitement pour moi, il suffit de changer le balisage tout u besoin ou un tableau.