نمایش محتوای دیتابیس در صفحه فروشگاه

سلام من میخوام محصولاتی که در دیتابیس ذخیره کردم نام، عکس و قیمت تمام محصولات رو در این صفحه نشون بده. و از طریق بوت استرپ میخوام در هر سطر 3 عدد باشه و وقتی صفحه کوچیک شد به دو عدد و یک عدد کاهش پیدا کنه. و بعدش در هر صفحه 9 عدد نشون بده و با زدن دکمه صفحه بعد 9 تای بعدی رو نشون بده من چطور باید این کارو بکنم؟

ضمیمه 154629

<div class="col-lg-4 col-md-6 col-12">
<div class="single-product">
<div class="product-img">
<a href="product-details.html">
<img class="default-img" src="https://via.placeholder.com/550x750" alt="#">
</a>
<div class="button-head">
<div class="product-action">
<a data-toggle="modal" data-target="#exampleModal" title="Quick View" href="#"><i class=" ti-eye"></i><span>Quick Shop</span></a>
<a title="Wishlist" href="#"><i class=" ti-heart "></i><span>Add to Wishlist</span></a>
<a title="Compare" href="#"><i class="ti-bar-chart-alt"></i><span>Add to Compare</span></a>
</div>
<div class="product-action-2">
<a title="افزودن به سبد خرید" href="#">افزودن به سبد خرید</a>
</div>
</div>
</div>
<div class="product-content">
<h3><a href="product-details.html">Women Hot Collection</a></h3>
<div class="product-price">
<span>$29.00</span>
</div>
</div>
</div>
</div>