有人知道如何使用Wordpress循环来完成以下结构,并在我的所有帖子中重复它吗?会很有帮助的。
我试图修改Joshua在这里提供的代码:http://goo.gl/8TnZf0 得到这个输出,但这对我来说有点脑筋急转弯。
-- loop --
// 6 posts
<div class="row">
<ul class="large-block-grid-6 columns">
<li>Post</li>
<li>Post</li>
<li>Post</li>
<li>Post</li>
<li>Post</li>
<li>Post</li>
</ul>
</div>
// next 2 posts in different row
<div class="row">
<ul class="large-block-grid-2 columns">
<li>Post</li>
<li>Post</li>
</ul>
</div>
// repeat this structure for all my posts so:
// 6 posts in a row
// 2 posts in a row
// 6 posts in a row
// 2 posts in a row
// ...
// ...
-- end loop --
这就是我现在拥有的:
<?php
$args = array ( \'post_type\' => \'werk\' );
query_posts( $args );
?>
<?php if (have_posts()) :
$count = 0;
while (have_posts()) : the_post();
$count++; ?>
<?php if ($count == 1) : ?>
<section style="border: 1px solid black;">
<ul class="large-block-grid-3 medium-block-grid-3 img-grid">
<?php
$image = get_field(\'work_img\');
if( !empty($image) ): ?>
<li>
<div class="grid-img equalize"><img src="<?php echo $image[\'url\']; ?>" alt=""></div>
<small><?php the_title(); ?></small>
</li>
<?php endif; ?>
<?php elseif ($count > 1 && $count < 7) : ?>
<?php
$image = get_field(\'work_img\');
if( !empty($image) ): ?>
<li>
<div class="grid-img equalize"><img src="<?php echo $image[\'url\']; ?>" alt=""></div>
<small><?php the_title(); ?></small>
</li>
<?php endif; ?>
<?php elseif ($count == 7) : ?>
</ul>
</section>
<section style="border: 1px solid black;">
<ul class="large-block-grid-2 medium-block-grid-3 img-grid">
<?php
$image = get_field(\'work_img\');
if( !empty($image) ): ?>
<li>
<div class="grid-img equalize"><img src="<?php echo $image[\'url\']; ?>" alt=""></div>
<small><?php the_title(); ?></small>
</li>
<?php endif; ?>
<?php elseif ($count > 6 && $count < 9) : ?>
<?php
$image = get_field(\'work_img\');
if( !empty($image) ): ?>
<li>
<div class="grid-img equalize"><img src="<?php echo $image[\'url\']; ?>" alt=""></div>
<small><?php the_title(); ?></small>
</li>
<?php endif; ?>
<?php elseif ($count == 9) : ?>
</ul>
</section>
<?php endif; ?>
<?php endwhile; ?>
<?php endif; ?>
最合适的回答,由SO网友:Mateusz Marchel 整理而成
首先,你不知道在你的案例中,你的帖子数量是否可以除以11,那么如果在循环结束时,你的第一部分中只有3篇帖子,会发生什么呢?计数器不会达到7,因此您的标记将因未关闭的标记而损坏。
EDIT:
根据更新,代码应该是这样的。事实上,这只是在这里和那里改变数字的问题。
您可以这样尝试:
<?php
$count = 0;
while ( have_posts() ) : the_post();
?>
<?php if( $count % 8 === 0 ) : ?>
<div class="row">
<ul class="large-block-grid-6 columns">
<?php endif; ?>
<?php if( $count % 8 === 6 ) : ?>
<div class="row">
<ul class="large-block-grid-2 columns">
<?php endif; ?>
<li><?php the_title(); ?></li>
<?php if( $count % 8 === 5 || $count % 8 === 7 ) : ?>
</ul>
</div>
<?php endif; ?>
<?php $count++; ?>
<?php endwhile; ?>
<?php
// we need to make sure that we close section
// rewind counter one step
$count--;
// check if last counter value was the one when we close tags and if not, close it
if( $count % 8 ==! 5 && $count % 8 ==! 7 ) :
?>
</ul>
</div>
<?php endif; ?>
我没有运行代码,所以我不能保证它能正常工作,但我希望你能明白这一点。