我正在使用一个 WP 网站,在我的模板中我正在运行这样的循环:
<!-- START LOOP -->
<?php while ( have_posts() ) : the_post(); ?>
<div class="row" style="margin:15px 0;">
<div class="twelve columns">
<div class="four columns">
<a href="<?php the_permalink(); ?>">
<?php
if ( has_post_thumbnail() ) {
the_post_thumbnail( 'medium' );
} else {
echo 'No Preview Available';
}
?>
</a>
</div>
<div class="eight columns">
<h3><a href="<?php the_permalink(); ?>"><?php the_title() ?></a></h3>
<p><?php the_excerpt() ?></p>
<p><a href="<?php echo esc_html( get_post_meta( get_the_ID(), 'portfolio_website', true ) ); ?>" target="_blank"><?php echo esc_html( get_post_meta( get_the_ID(), 'portfolio_website', true ) ); ?></a></p>
</div>
</div>
</div>
<hr />
<?php endwhile; ?>
因为这是一个响应式网站,所以我试图获得一个网格列的外观。我遇到的问题是如何在每第三个项目之后插入一个带有类或“行容器”的 div?
我知道我可能只是把你的废话弄糊涂了,因为我把自己弄糊涂了,但简而言之,html 看起来像这样:
<div class="row container">
<!-- item 1 -->
<div class="twelve columns">
<div class="four columns">IMAGE HERE</div>
<div class="eight columns">TEXT HERE</div>
</div>
<!-- item 2 -->
<div class="twelve columns">
<div class="four columns">IMAGE HERE</div>
<div class="eight columns">TEXT HERE</div>
</div>
<!-- item 3 -->
<div class="twelve columns">
<div class="four columns">IMAGE HERE</div>
<div class="eight columns">TEXT HERE</div>
</div>
<!-- item 4 -->
<div class="twelve columns">
<div class="four columns">IMAGE HERE</div>
<div class="eight columns">TEXT HERE</div>
</div>
</div>
依此类推,我希望它显示在网格中,因此 HTML 应该看起来更像这样:
<div class="row container">
<!-- row 1 -->
<div class="twelve columns">
<div class="four columns">
<!-- item 1 -->
<div class="four columns">IMAGE HERE</div>
<!-- item 2 -->
<div class="four columns">IMAGE HERE</div>
<!-- item 3 -->
<div class="four columns">IMAGE HERE</div>
</div>
</div>
<!-- row 2 -->
<div class="twelve columns">
<div class="four columns">
<!-- item 4 -->
<div class="four columns">IMAGE HERE</div>
<!-- item 5 -->
<div class="four columns">IMAGE HERE</div>
<!-- item 6 -->
<div class="four columns">IMAGE HERE</div>
</div>
</div>
</div>
我可以做其他所有事情我只是不确定如何实现以下内容,所以我得到了上面粘贴的结果?我在网上找到了这个,觉得这是朝着正确方向迈出的一步:
<?php ($i % 3) == 0 ?>