Support

Account

Home Forums General Issues Repeater with Bootstrap 3

Solving

Repeater with Bootstrap 3

    • KNZ

    • February 23, 2019 at 1:58 am

    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 !!

    • Derek B

    • March 12, 2019 at 12:05 am
    <?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>
    • Derek B

    • March 12, 2019 at 12:07 am

    You need to close off the row every time there is 4 columns, this should work $i is the count for columns

    • Derek B

    • March 12, 2019 at 3:58 am

    <?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)

You must be logged in to reply to this topic.

We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Cookie Policy. If you continue to use this site, you consent to our use of cookies.