2015-10-26 129 views
1

所以我需要使用ACF中的repeater字段輸出我的網站的一部分。我設置它的方式會在每次調用時創建一個新的<div class="row landing-item">。我需要它每2次創建一次,這樣html就可以正確佈局。ACF中繼器字段行和列

<section class="row landing"> 
<h2>Featured Sections</h2> 
<?php if(have_rows('landing_page_landing_items')): ?> 
    <?php while (have_rows('landing_page_landing_items')) : the_row(); ?> 
     <div class="row landing-item"> 
      <div class="small-12 medium-6 columns"> 
       <img src="<?php the_sub_field('landing_image'); ?>"> 
       <h3><?php the_sub_field('landing_title'); ?></h3> 
       <p><?php the_sub_field('landing_text'); ?></p> 
       <a class="button" href="<?php the_sub_field('landing_link'); ?>">Learn More</a> 
      </div> 
     </div><!-- end landing-item --> 
    <?php endwhile; ?> 
<?php endif; ?> 

如果你看看最後的結果我需要的是上面2列一排,然後用2列等等等等排。現在再說一次,每次給我一行一列。我試着在行和列的外部和內部移動腳本啓動,但無法獲得正確的序列。

回答

0

看起來您可能能夠通過使用基礎塊網格功能而不是標準網格來實現您的最終目標。如果您使用塊網格,則只會根據列表中項目的數量繼續重複行。見下:

<section class="row landing"> 
    <h2>Featured Sections</h2> 
    <div class="row landing-item"> 
     <ul class="small-block-grid-1 medium-block-grid-2"> 
      <?php if(have_rows('landing_page_landing_items')): ?> 
       <?php while (have_rows('landing_page_landing_items')) : the_row(); ?> 
         <li> 
          <img src="<?php the_sub_field('landing_image'); ?>"> 
          <h3><?php the_sub_field('landing_title'); ?></h3> 
          <p><?php the_sub_field('landing_text'); ?></p> 
          <a class="button" href="<?php the_sub_field('landing_link'); ?>">Learn More</a> 
         </li> 
       <?php endwhile; ?> 
      <?php endif; ?> 
     </ul> 
    </div><!-- end all landing items --> 
</section> 

如果你需要做任何特殊的每行編輯,你可能需要做一些CSS。我認爲這可能是解決你的困境的一個方法。