Wordpress循环:连续包装3个搜索结果

时间:2015-12-24 14:05:42

标签: php wordpress twitter-bootstrap

我已经设置了我的模板来输出col-4中的搜索条目以进行3列布局,我需要连续包装每组3个。

我已经提出了下面的内容,但似乎我的开放和结束PHP是错误的,因为我目前正在获取其中每一个搜索条目的行。在此先感谢您的帮助

<?php 
if ($counter % 3 == 0) { 
  echo '<div class="row">';
} ?>


<article id="post-<?php the_ID(); ?>" class="search-result col-md-4">
    <?php
    $entry_thumbnail = racks_entry_thumbnail();
    $entry_class = $entry_thumbnail ? 'search-thumbnail' : 'col-sm-4 col-md-4';
    ?>
        <?php if( $entry_thumbnail ) : ?>
            <div class=" <?php echo esc_attr( $entry_class ); ?>">
                <?php echo $entry_thumbnail; ?>

            <header class="entry-header clearfix">
                <h2 class="entry-title"><a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>" rel="bookmark"><?php the_title() ?></a></h2>
                </header>

        <div class="entry-summary">
          <?php the_excerpt(); ?>
        </div>

        <footer class="entry-footer">
          <a class="read-more" href="<?php the_permalink() ?>"><?php _e( 'Read more', 'racks' ) ?></a>
        </footer>

    </div>
        <?php endif;?>
    <div class="clearfix"></div>
</article><!-- #post-## -->

<?php $counter++ ; echo '</div>'; ?>

1 个答案:

答案 0 :(得分:3)

不要忘记你只需关闭</div>以便将$ div整除为3:

<?php 
  echo ($counter % 3 === 0) ? '</div>' : '';
  $counter++;
?>

目前,您在循环的每一步都关闭</div>。另请注意,您可能希望在迭代开始时进行此检查,并将其结果分配给变量。例如:

<?php

$counter = 0;
while ($counter < someLimit):
  $newRow = $counter % 3 === 0;

?>

  // at the beginning of template:
  <?= $newRow ? '<div class="row">' : ''; ?>

  // output goes here

  // at the end of template:
  <?= $newRow ? '</div>' : ''; ?>

<?php endwhile; ?>

另一种方法是使用输出缓冲区来存储某个数组中每个元素的输出,将此数组拆分为块(带array_chunk()),然后输出这些块(将每个块包装在<div class="row"></div>结构中)。