Wordpress - Как я могу зацикливаться на двух разных DIVS без повторения DIV

Question

У меня возникла небольшая проблема, пытаясь понять, как я могу это сделать: у меня есть контейнер с двумя столбцами, правым и левым столбцом. В каждом столбце будет 3 сообщения с краткой выдержкой. В идеале я хотел бы добавить один справа и один слева до тех пор, пока он не достигнет 3 рядов сообщений (хотя, если это окажется намного более сложной задачей, чем я, если я отправлю сообщение в первый столбец, а не во второй. Я могу циклически просматривать посты и добавлять их в один столбец, но у меня возникают проблемы с выяснением того, как один будет зацикливаться на два отдельных div, без повторения div. Вот как я пытаюсь это сделать, пока этот код будет зацикливаться на левый столбец.

Первая левая сторона использует цикл для отображения заголовка (отрывок придет после), а правая часть просто использует html. Может ли кто-нибудь помочь мне понять это?

      <h2>Popular posts</h2>
       <h3>Showing the most popular posts.</h3>

<div class="col4 inner-left">
       <ul class="popular-list">
   <?php
       query_posts('meta_key=post_views_count&orderby=meta_value_num&order=DESC&posts_per_page=10&post_type=pop');
       if (have_posts()) : while (have_posts()) : the_post(); ?>
            <li>
             <a href=<?php the_permalink(); ?>><?php the_title(); ?></a>
             <p>Popular post. This is a popular post, it really is.</p>
            </li>
   <?php
       endwhile; endif;
       wp_reset_query();
    ?>          
        </ul>
    </div>

<div class="col4 inner-right">
        <ul class="popular-list">
            <li>
              <a href="popularpostlink.php">This is a popular post</a>
              <p>Popular post. This is a popular post, it really is.</p>
            </li>
                 <li>
                  <a href="popularpostlink.php">This is a popular post</a>
                  <p>Popular post. This is a popular post, it really is.</p>
                </li>
            </ul>
        </div>

Answer 1

Вам просто нужно применить логику того, как вы хотите, чтобы сообщения были организованы, прежде чем начинать их итерацию.

Вот пример (это не работает, просто небольшая иллюстрация):

<?php
$col1 = array();
$col2 = array();
$posts = array('one', 'two', 'three', 'four', 'five', 'six');
foreach ($posts as $post) {
    $count++;
    $count % 2 === 1 ? array_push($col1, $post) : array_push($col2, $post);
}
?>
<div class="col-1">
    <?php
    foreach ($col1 as $post) {
        echo '<div class="post">'.$post.'</div>';
    }
    ?>
</div>
<div class="col-2">
    <?php
    foreach ($col2 as $post) {
        echo '<div class="post">'.$post.'</div>';
    }
    ?>
</div>

Это дает результат:

<div class="col-1">
    <div class="post">one</div>
    <div class="post">three</div>
    <div class="post">five</div>
</div>

<div class="col-2">
    <div class="post">two</div>
    <div class="post">four</div>
    <div class="post">six</div>
</div>

Как видите, теперь элементы массива $posts поочередно организованы в обоих столбцах.