How To Wrap Every 2 WordPress Posts Inside Bootstrap Row Class

Share Now

Project Name: DCP Site
Layout Example: View Example

#CODE EXAMPLE

<div id="main" class="container" role="main">
  <div class="row">
        <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

          <article class="col-md-6" id="post-<?php the_ID(); ?>" role="article">

          <!-- loop content -->


          </article>
        <?php $counter++;
          if ($counter % 2 == 0) {
          echo '</div><div class="row">';
        }
        endwhile; endif; ?>
  </div><!-- /row -->
</div><!-- /container -->

#MAIN CODE EXAMPLE

<div class="row">
    <?php
    $args = [
        'post_type' => 'post',
        'post_status' => 'publish',
        'orderby' => 'date',
        'order' => 'DESC',
        'ignore_sticky_posts' => 1,
        'suppress_filters' => true,
        'posts_per_page' => 6,
        'paged' => $paged,
    ];
    $dcp_query = new WP_Query($args);
    ?>

	<?php if ($dcp_query->have_posts()): ?>
    <?php
    $post_count = 0;
    while ($dcp_query->have_posts()):
        $dcp_query->the_post(); ?>
    
    <?php get_template_part('template-part/blog-card'); ?>
    <?php
    $post_count++;
    if ($post_count % 2 == 0) {
        echo '</div><div class="row">';
    }
    ?>
    

    <?php
    endwhile;
    wp_reset_postdata();
    ?>
    <?php else: ?>
        <h3>No Post Found</h3>
    <?php endif; ?>

</div>
Picture of Nahid Mahamud

Nahid Mahamud

Web Developer | Graphic Designer | WordPress & Woo-commerce Expert