Question

我查看了Stackoverflow上的一些关于将帖子分成三列的示例。我在实施示例时遇到了一些困难。希望有人可以提供帮助。

我有一个有问题的常见问题解答页面。当用户点击阅读时，文本块会展开。我想将问题分为三列。问题的顺序无关紧要。只要它均匀地填满行。

看起来应该是这样的：
[问题X] [问题A] [问题Z]
[问题H] [问题J] [问题K]
[问题B] [问题V]

我已经构建了Bootstrap网格，以解决我的空行问题，当有人点击阅读更多并且文本展开时。

<?php if ( $wp_query->have_posts() ) : ?>
<div class="row custom-gutter-faq">

 <!--COLUMN ONE-->
       <div class="col-lg-4">
         <div class="col-lg-12">
                <?php while ( $wp_query->have_posts() ) : $wp_query->the_post(); ?>
                  <div class="faq-all">
                    <div class="faq-item">
                        <h2><?php the_title(); ?></h2>
                        <article>
                          <div class="faq-intro">
                             <?php the_content(); ?>
                          </div>
                          <div class="faq-info">
                             <?php the_content(); ?>
                          </div>   
                          <div class="faq-link">
                            <a href="#" class="read-more">LES HELE SVARET</a>
                            <a href="#" class="read-less">LES MINDRE</a>
                        </div>
                       </article>
                    </div>
                  </div>
                <?php endwhile; ?>
             </div>
             </div>
            <!--end one-->

            <!--COLUMN TWO-->
           <div class="col-lg-4">
              <div class="col-lg-12">
                <?php while ( $wp_query->have_posts() ) : $wp_query->the_post(); ?>
                  <div class="faq-all">
                    <div class="faq-item">
                        <h2><?php the_title(); ?></h2>
                        <article>
                          <div class="faq-intro">
                             <?php the_content(); ?>
                          </div>
                          <div class="faq-info">
                             <?php the_content(); ?>
                          </div>   
                          <div class="faq-link">
                            <a href="#" class="read-more">LES HELE SVARET</a>
                            <a href="#" class="read-less">LES MINDRE</a>
                        </div>
                       </article>
                    </div>
                  </div>
                <?php endwhile; ?>
             </div>
            </div>
            <!--end two-->

            <!--COLUMN THREE-->
            <div class="col-lg-4">
              <div class="col-lg-12">
                <?php while ( $wp_query->have_posts() ) : $wp_query->the_post(); ?>
                  <div class="faq-all">
                    <div class="faq-item">
                        <h2><?php the_title(); ?></h2>
                        <article>
                          <div class="faq-intro">
                             <?php the_content(); ?>
                          </div>
                          <div class="faq-info">
                             <?php the_content(); ?>
                          </div>   
                          <div class="faq-link">
                            <a href="#" class="read-more">LES HELE SVARET</a>
                            <a href="#" class="read-less">LES MINDRE</a>
                        </div>
                       </article>
                    </div>
                  </div>
                <?php endwhile; ?>
             </div>
           </div>
           <!--end three-->

目前我正在接受这个帖子三次。我只想获得一次帖子并将该帖子分成三列。

进入第一列的所有内容都需要进入代码中的第一列，同样需要进入第二列的所有内容都需要进入代码中的第二列。

我一直在努力解决这个问题。无法让Stackoverflow上的示例为我工作。

提前致谢

Answer 1

我很确定这就是你要找的东西。一个简单的方法是通过添加一个＆＃34;计数器＆＃34;变量并在每次添加新帖子时添加到计数中（$ counter ++）。最后我们看看＆＃34;计数器＆＃34; /＆＃34;行数＆＃34;余数为零。

<?php if ( $wp_query->have_posts() ) : ?>
        <?php 
            $counter=0;
            $total_posts = $wp_query->post_count;
            $posts_per_column = ceil($total_posts / 3);
        ?>
      <div class="row custom-gutter-faq">
        <div class="col-lg-4">
          <div class="col-lg-12">
                <?php while ( $wp_query->have_posts() ) : $wp_query->the_post(); $counter++; ?>                 
              <div class="faq-all">
                <div class="faq-item">
                  <h2><?php the_title(); ?></h2>
                  <article>
                    <div class="faq-intro">
                       <?php the_content(); ?>
                    </div>
                    <div class="faq-info">
                       <?php the_content(); ?>
                    </div>   
                    <div class="faq-link">
                      <a href="#" class="read-more">LES HELE SVARET</a>
                      <a href="#" class="read-less">LES MINDRE</a>
                  </div>
                 </article>
                </div>
              </div> 
                <!-- Close and open div if the "counter" divided by the "posts per column" of columns you want equals zero -->
                <?php if($counter % $posts_per_column == 0) echo '</div></div><div class="col-lg-4"><div class="col-lg-12">'; ?>
                <?php endwhile; ?>
            </div>
        </div>
      </div>
    <?php endif; ?>

PHP和Wordpress，如何将帖子分成三个 - 初学者

1 个答案: