php - wordpress 中的 Bootstrap 列自定义

Question

在 wordpress 中，我试图通过 get_pages 获取页面，如下所示:

    <div class="container">
    <div class="row">
        <div class="col-md-4">
            <div class="row">
                <div class="col-md-12">
                    Page One
                </div><!--col 12-->

                <div class="col-md-12">
                    Page Two
                </div><!--col 12-->
            </div><!--row-->
        </div><!--col 4-->

        <div class="col-md-4">
            Page Three
        </div><!--col 4-->

        <div class="col-md-4">
            <div class="row">
                <div class="col-md-12">
                    Page Four
                </div><!--col 12-->

                <div class="col-md-12">
                    Page Five
                </div><!--col 12-->
            </div><!--row-->
        </div><!--col 4-->

    </div><!--row-->
</div><!--container-->

其中，

1. 第 1 列和第 3 列应各有 2 行。
2. 第二个应该只有1个。
3. 第 2 列的高度等于第 1 列和第 3 列的高度，就像砌体一样。

我尝试使用 if 条件但没有成功。请指教。

谢谢，维克拉姆

Answer 1

我还没有尝试测试它，但请检查一下:)只需将 php 代码放在上面

$result = get_pages() etc..
     <div class="container">
        <div class="row">
           <div class="col-md-4">
            foreach($result => $key as $pages):
              if($key !== 2):
                <div class="col-md-12">
                   // Page One, two, four....
                </div><!--col 12-->

              else:
            </div> <!-- end col-md-4 -->
           <div class="col-md-4">
          //  Page Three
           </div><!--col 4-->    
         <div class="col-md-4"> <!-- make a new one -->
         endif;
        endforeach;
        </div>   <!-- end first col-md-4 -->

    </div><!--row-->
</div><!--container-->