複数のアイテム数に基づいてグリッドを定義

Question

問題を解決するために、私はWordPressの高度なカスタムフィールドのリピーターフィールドを使用してクラスを動的に定義しています。私はいくつかの掘り出し物をしましたが、私が探している特異性を持つリソースを見つけることができませんでした。

私は一連のポートフォリオイメージを表示していますが、その数に応じて特定の写真にFoundationグリッド内の特定のクラス名を付けたいと思います。基本的に私は、次の操作を実行しているよ：

• 項目1-4の場合：5+項目については、大6
• のクラスを適用します：のみ1場合は、大4
• のクラスを適用します。 item：大規模クラスのクラスを適用する

私は最初の2つの例を動作させることができましたが、3番目のパラメータセットの定義に問題があります。私はさまざまなルートを試しましたが、この時点で何が最善であるかはわかりません。私が達成しようとしているもののモックアップと私のコード例を参照してください。

アドバイスをよろしくお願いいたします。

<div class="row portfolio-examples"> 
 

 
\t <?php 
 
     if(have_rows('portfolio_examples')): 
 
     \t while (have_rows('portfolio_examples')) : the_row(); 
 
\t \t \t \t $count = 0; 
 
\t \t \t \t $work = get_sub_field('portfolio_work'); 
 
    ?> 
 
        
 
    \t <?php if ($count != 0 || $count < 4) :?> 
 
     
 
     <div class="large-6 medium-6 columns end"> 
 
      <?php if($work): ?> 
 
       <img src="<?php echo $work['url']; ?>" alt="<?php echo $work['alt'] ?>" /> 
 
      <?php endif; ?> 
 
     </div> 
 
    
 
    \t <?php else: ?> 
 
     
 
\t <div class="large-8 medium-8 large-centered medium-centered columns"> 
 
      <?php if($work): ?> 
 
       <img src="<?php echo $work['url']; ?>" alt="<?php echo $work['alt'] ?>" /> 
 
      <?php endif; ?> 
 
      </div> 
 
     
 
    <?php endif; ?> 
 
    
 
    <?php 
 
     $counter++; 
 
     endwhile; 
 
     endif; 
 
    ?> 
 
    
 
</div>

Answer 1

あなたはが大のクラスを適用するか小さなのクラスを適用しますが、その後、あなたのコードで言うので、あなたの質問は、私には十分に明確ではありません.large-6、また.large-8を使用します。

<div class="row portfolio-examples"> 
<?php 
if (have_rows('portfolio_examples')) : 
    /* We need to know the total number 
    * of rows in your repeater since you have 
    * a case where there's only one item. 
    */ 
    $portfolio = get_field('portfolio_examples'); 
    $count = is_array($portfolio) ? count($portfolio) : 0; 
    $index = 0; 
    while (have_rows('portfolio_examples')) : the_row(); 
     if ($count == 1) : 
      /* Place here your code for when 
      * there's only 1 item in your portfolio. 
      */ 
      ?> 
      <div class="medium"><!-- Medium item --></div> 
      <?php 
     elseif ($count > 1 && $index <= 3) : 
      // Code for your first 4 items 
      ?> 
      <div class="large"><!-- Large item --></div> 
      <?php 
     elseif ($count > 1 && $index > 3) : 
      // Code for your 5+ items 
      ?> 
      <div class="small"><!-- Small item --></div> 
      <?php 
     else : 
      // There are no items in your portfolio. 
     endif; 
     $index++; 
    endwhile; 
endif; 
?> 
</div> 

お知らせ：あなたは0あなた反復子インデックスにresetingたとにかく

は、（あなたのイメージ与えられた）あなたが達成しようとしているものを想定し、PHPコードは次のようなものでなければなりません（あなたの場合は$count）を毎回繰り返します。また、定義されていない$counter（$countではなく）をインクリメントしていました。