Title: Row loop
Last modified: June 6, 2017

---

# Row loop

 *  Resolved [theredeclipse](https://wordpress.org/support/users/theredeclipse/)
 * (@theredeclipse)
 * [9 years ago](https://wordpress.org/support/topic/row-loop/)
 * Hello, I have a simple catalog which shows child pages with thumbnails. As my
   theme uses a bootstrap I need to change row every 4 colums otherwise layout crashes.
   Everything what I’ve tried not working or it disable ACF fields
 *     ```
       <?php
       					$mypages = get_pages( array( 'child_of' => $post->ID,'parent' => $post->ID, 'sort_column' => 'post_date','sort_order' => 'desc' ) );
   
       					foreach( $mypages as $page ) {		
       						$content = $page->post_content;
   
       						if ( ! $content ) // Check for empty page
       							continue;
       						$content = apply_filters( 'the_content', $content );
   
       					?>
       					              <div class="col-xs-12 col-sm-6 col-lg-3">
                       <div class="shop-product-card">
       										<?php echo get_the_post_thumbnail( $page->ID, 'subpage' ); ?>
   
                         <div class="product-image-wrapper">
                           <span class="label label-red sale-label"><?php the_field('field-special-offer', $page->ID ); ?></span>
                           <a href="#" class="fav-btn"><span class="linea-basic-star"></span></a>
                           <div class="shop-p-slider fancybox">
                             <a data-fancybox="field-10" href="<?php echo $image['url']; ?>"><img height="200px" src="<?php $image = get_field( 'image-1', $page->ID );
                               echo $image['url']; ?>"></a>
       					  <a data-fancybox="field-10" href="<?php echo $image['url']; ?>"><img height="200px" src="<?php $image = get_field( 'image-2', $page->ID );
                               echo $image['url']; ?>"></a>
                           </div>
                         </div>
                         <div class="product-meta">
                           <a href="/"><h4 class="product-name"><?php echo get_the_title( $page->ID ); ?></h4></a>
                           <span class="product-sep"></span>
                           <p class="product"><?php the_field('field-short-description', $page->ID ); ?></p>
       					<a class="btn-ghost btn-ghost-light ft-button" href="<?php echo get_page_link( $page->ID ); ?>">details</a>
                         </div>
   
       					</div>
       					</div>	
       					<?php
       						}	
       					?>
       ```
   
 * Any input would be appreciated

Viewing 2 replies - 1 through 2 (of 2 total)

 *  [Adam Morgan](https://wordpress.org/support/users/adam3128/)
 * (@adam3128)
 * [9 years ago](https://wordpress.org/support/topic/row-loop/#post-9203045)
 * Hey theredeclipse,
 * So you’re trying to add a row div after every 4 loops?
 * The modulus operator should be able to handle this for you.
 *     ```
       <?php
        $counter = 1;
   
       foreach($mypages as $page) {
   
       if($counter % 4 == 0) {
         echo '<div class="row">';
       }
   
        the_content();
   
       if($counter % 4 == 0) {
         echo '</div>';
       }
   
       $counter++;
       }
       ```
   
 * This checks the counter value against a division of 4 and returns the remainder.
   If it’s 0 we add the markup.
 * You could always look at adding some media queries though and/or just display
   inline-block the div elements for a smoother layout.
 * Hope this helps
 * Adam
 *  Thread Starter [theredeclipse](https://wordpress.org/support/users/theredeclipse/)
 * (@theredeclipse)
 * [9 years ago](https://wordpress.org/support/topic/row-loop/#post-9204221)
 * Thanks a lot! Everything works now.

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Row loop’ is closed to new replies.

 * In: [Developing with WordPress](https://wordpress.org/support/forum/wp-advanced/)
 * 2 replies
 * 2 participants
 * Last reply from: [theredeclipse](https://wordpress.org/support/users/theredeclipse/)
 * Last activity: [9 years ago](https://wordpress.org/support/topic/row-loop/#post-9204221)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics