Hi Guys I'm trying to format this WordPress loop into a col-4 bootstrap layout but I'm having no luck. Can anyone please help? Im trying to display each "bucket-top-row" div into a col-4 layout.
<div class="container">
<?php
// get all the categories from the database
$cats = get_the_category();
// loop through the categries
foreach ($cats as $cat) {
// setup the cateogory ID
$cat_id= $cat->term_id;
// Make a header for the cateogry
// echo "<h2>".$cat->name."</h2>";
// create a custom wordpress query
query_posts("cat=$cat_id&posts_per_page=10");
// start the wordpress loop!
if (have_posts()) : while (have_posts()) : the_post();
?>
<div class="bucket-top-row row">
<div class="col-lg-4">
<div class="bucket-wrapper-standard-top-row">
<img class="image-bucket-standard" src="<?php echo get_template_directory_uri() . '/images/blog-images/hero-img-1.jpg'; ?>" />
<h4 id="post-<?php the_ID(); ?>" class="bucket-text-standard">
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h4>
<p class="bucket-paragraph">
<?php /* the_permalink() */?>
</p>
<div class="author-text-bucket">
<div class="author-image six-sm">
<img class="author-img-post" src="<?php echo get_template_directory_uri() . '/images/author-headshots/fitness-mark.png'; ?>" />
</div> <span class="author-name-post-bucket "><?php> the_author(); ?></span>
<span class="bucket-category"><?php> the_category(); ?></span>
<div class="lower-bucket-text">
<span class="author-job-title-bucket "><?php> the_author_nickname(); ?></span>
<span class="bucket-read-time">3min read</span>
</div>
<div class="underline-bucket"></div>
</div>
</div>
</div>
</div>
<?php endwhile; endif; // done our wordpress loop. Will start again for each category ?>
<?php } // done the foreach statement ?>
Boxes should display 3 across (col-4)