Adding extra element with modulus in a PHP loop

[tester15]

Hello guys,

I am using a Bootstrap grid with 6 element (As articles). 5 come directly from the database, and I need to add one more article element at the beginning, just for aesthetics. This is what I have so far. Any help is welcome. Thank you!

Here’s the idea of what i need https://imgur.com/a/JTlROZ2

<?php $i = 0 ?>
<?php  START  LOOP ?>
<?php if($i % 2 == 0): ?> 
<div class="ps-box"><!-- POST -->
   <div class="row"><!-- ROW -->
      <?php endif; ?>
      <article>
         Element
      </article>
      <?php if($i % 2 != 0): ?>
   </div><!-- / ROW -->
</div><!-- / POST -->
<?php endif; ?>
<?php $i++ ?>
<?php END  LOOP ?>

[John_Betong]

Hi @tester15 and a warm welcome to the forum.

Try this and amend dimensions to suit your requirements:

<?php declare(strict_types=1);
error_reporting(-1);
ini_set('display-errors', 'true');

// $i = 0; 
// START  LOOP 
  echo '<article style="background-color: lime; width: 60em; height: 22em; padding: 2em;">';
    for($i=0; $i<7; $i++) :
      
      if($i === 0): 
        echo '<div style="margin: 1em; float: left; background-color: aqua; width: 12em;" class="ps-box"><!-- POST -->';
          echo '$i ==> ' .$i;
        echo '</div class="row"><!-- ROW -->';
      else:
       echo '<div style="margin: 1em; float: left; background-color: red; width: 12em;" ><!-- / ROW -->';
          echo '$i ==> ' .$i;
       echo '</div><!-- / POST -->';
      endif; 

      if($i % 2 != 0): 
       # echo '</div><!-- / ROW -->';
       # echo '</div><!-- / POST -->';
      endif; 
      # echo    'Element ==> ' .$i;
    endfor;
    echo '<br style="clear: both;">';
 echo '</article>';
// $i++ 
// END  LOOP ?>

[tester15]

Thanks John!
That worked perfect!

[John_Betong]

I’m pleased you managed to get it to work to your satisfaction.

For the benefit of other users with similar problems may I suggest submitting the final version. CSS classes used would also helpful.