Question

我需要在Wordpress中使用以下内容：

<div class="posts-wrapped">
    <div id="post-1" class="post">
        <h1>Title 1</h1>
    </div>
    <div id="post-2" class="post">
        <h1>Title 2</h1>
    </div>
</div>
<div class="posts-wrapped">
    <div id="post-3" class="post">
        <h1>Title 3</h1>
    </div>
    <div id="post-4" class="post">
        <h1>Title 4</h1>
    </div>
</div>

我知道如何使用WP循环获取帖子，但是如何在.posts-wrapped div中包装每两个帖子？

我使用WP_Query获取帖子。

谢谢！

编辑：所以我尝试了几种方法来做到这一点。例如：

$index=0;
<div class="posts-wrapped">

<?php
while ( have_posts() ) {
    $index++;   
?>
<div class="post">
        <h1><?php the_post(); ?></h1>
    </div> <?php
if(($index % 2) ==0){
echo '</div><div class="posts-wrapped">';
}
} ?>

</div>

但这会打印一个额外的空帖子包裹的div：

<div class="posts-wrapped">
    Lorem ipsum 1<br>
    Lorem 2 ipsum est<br>
</div>
<div class="posts-wrapped">
    Lorem ipsum 1<br>
    Lorem 2 ipsum est<br>
</div>
<div class="posts-wrapped">
</div>

我怎样才能摆脱这最后一个空div？它拧我的旋转木马（这个内容是旋转木马的一部分）。

Answer 1

获取计算循环迭代的索引并检查模数运算以了解其偶数或奇数

$index=0;
<div class="posts-wrapped">

<?php
while ( have_posts() ) {
    $index++;   
?>
<div class="post">
        <h1><?php the_post(); ?></h1>
    </div> <?php
if(($index % 2) ==0){
echo '</div><div class="posts-wrapped">';
}
} ?>

</div>

Answer 2

这应该有效：

<?php
while(have_posts()){
    the_post();
?>
<div class="posts-wrapped">
    <div class="post">
        <h1><?php the_title(); ?></h1>
    </div>

    <?php
    if(have_posts()){ //Makes sure you have another post
        the_post();
    ?>
        <div class="post">
            <h1><?php the_title(); ?></h1>
        </div>
    <?php
    }
    ?>
</div>
<?php
}
?>

Answer 3

<?php
$i = 0;
if (have_posts()) : 
    while (have_posts()) : the_post();

    if($i == 0) {
        echo '<div class="posts-wrapped">';
    } ?>

    <div class="post">
        <h1><?php the_title(); ?></h1>
    </div>

<?php
$i++;
if($i == 2) {
    $i = 0;
    echo '</div>';
}

endwhile; 

if($i > 0) {
    echo '</div>';
}
?>

请您尝试上面的代码吗？

同一个div中的两个帖子 - WP循环

3 个答案: