Support

Account

Home Forums General Issues Repeater with Bootstrap 3

Solving

Repeater with Bootstrap 3

  • Hey !
    I wrote this topic because I didn’t find an answer from here or other forums on the web.

    I don’t know how to manage this with Bootstrap.

    I use a repeater to repeat some items from 1 to infinite number. For those who don’t know, Bootstrap work with rows. One row contain 12 columns. My items have 3 columns, so I can insert 4 items in a row.

    I don’t know how to “break” the row to create another one, each 4 items. This problem is very often embarrassing for me.

    That’s a bit of my code :

    
    <div class="row">
    
            <?php
    
              if(have_rows('unite')):
                while(have_rows('unite')): the_row();
            ?>
            
            <div class="col-md-3">
              <div class="text-bloc single-tarif">
                <h3><?= the_sub_field('nom') ?></h3>
                <?= the_sub_field('description') ?>
    
                <span class="prix"><?= the_sub_field('prix') ?></span>
              </div>
            </div>
    
            <?php
                endwhile;
              else:
              endif;
            ?>
    
          </div>
    

    How can I modificate it to start a new row each 4 items and break the previous row each 4 items, without forgetting I have to close the last row at the end, no matter how many items I have.

    Thanks !!

  • <?php $i = 1; ?>
              <div class="row">
    
                <?php while ( have_rows('unite') ): the_row(); ?>
                  <div class="col-md-3">
                      <h3><?php the_sub_field('nom'); ?></h3>
                  </div>
    
                  <?php
                    if( $i == 4 ){
                      echo '</div><div class="row">';
                      $i = 0;
                    }
                    $i++;
                  ?>
                <?php endwhile; ?>
              </div>
  • You need to close off the row every time there is 4 columns, this should work $i is the count for columns

  • <?php $i = 1; ?>
    <div class=”row”>

    <?php while ( have_rows(‘unite’) ): the_row(); ?>
    <div class=”col-md-3″>
    <h3><?php the_sub_field(‘nom’); ?></h3>
    </div>

    <?php
    if( $i == 4 ){
    echo ‘</div><div class=”row”>’;
    $i = 0;
    }
    $i++;
    ?>
    <?php endwhile; ?>
    </div>

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Repeater with Bootstrap 3’ is closed to new replies.