I'm having issues displaying products on a site correctly, i'm trying to show 3 products on each row which will keep the same size and not break the display up.
Code:
<?php
//error_reporting(1);
// Query depending ...
$theQuery = "";
if (!isset($_GET['catId'])) {
$theQuery = "SELECT * FROM `products` WHERE `product_active`='Y' ORDER BY RAND() LIMIT 24";
} else {
$theQuery = "SELECT * FROM `products` WHERE `product_category_id`='{$_GET['catId']}' AND `product_active`='Y' ORDER BY RAND() LIMIT 24";
}
// Execute 1 of the 2 queries.
$randomProducts = DB::getInstance()->select($theQuery);
?>
<div class="container-fluid" id="container">
<div class="col-md-8">
<div class="row equal">
<?php foreach ($randomProducts as $product) { ?>
<?php $p = json_decode($product['product_json_body'], true); ?>
<?php if (!empty($p['name'])) { ?>
<div class="item col-xs-4 col-lg-4">
<div class="thumbnail">
<div class="space-ten"></div>
<img src="<?php echo $p['images'][0]; ?>" alt="" style="width:450px; height:450px;" class="group list-group-image">
<div class="caption">
<h4 class="pull-right"><span class="text-danger"><b>$<?php echo number_format($p['priceRange']['maxPrice'], 2); ?></b></span></h4>
<h4><span class="text-success"><b><a href="product.php?productId=<?php echo $product['product_id']; ?>"><?php echo $p['name']; ?></a></b></span></h4>
<p><?php echo $p['descriptionText']; ?></p>
</div>
<div class="space-ten"></div>
<div class="btn-ground text-center">
<form action="cart.php" method="post" class="form-horizontal container-fluid">
<input type="hidden" name="cartQTy" value="1" />
<input type="hidden" name="cartPId" value="<?php echo $product['product_id']; ?>" />
<input type="hidden" name="cartPNm" value="<?php echo $p['name']; ?>" />
<input type="hidden" name="cartPce" value="<?php echo number_format($p['priceRange']['maxPrice'], 2); ?>" />
<input type="hidden" name="cartUId" value="<?php echo $member; ?>" />
<input type="hidden" name="cartImg" value="<?php echo $p['images'][0]; ?>" />
<input type="hidden" name="cartTfs" value="<?php echo "source01"; ?>" />
<button type="submit" class="btn btn-primary"><i class="fa fa-shopping-cart"></i> <span class="glyphicon glyphicon-shopping-cart"></span> Add To Cart</button>
<!--<button type="button" class="btn btn-primary" data-toggle="modal" data-id="<?php echo $product['product_id']; ?>" data-target="#product_view"><i class="fa fa-search"></i> <span class="glyphicon glyphicon-eye-open"></span> Quick View</button>-->
</form>
</div>
<div class="space-ten"></div>
</div>
<?php } ?>
<?php } ?>
</div></div></div>
It's quite basic code, i'm using the bootstrap framework, with just some PHP to loop out the products, a test display is here: https://www.we-love-unicorns.club/ everytime i try to fix it, i make it worse, i have removed and added divs nothing seems to work, can anyone see any issues i may have missed?
