Laravel 12 E-Commerce Project Tutorial

Showing Featured Products on the Home Page

Hi everyone, welcome back to the Laravel E-Commerce Project Tutorial. This video focuses on implementing the functionality to display Featured Products dynamically on the home page.

  1. Fetch Featured Products in `HomeController`

    Open your `HomeController.php` and update the `index` function. We will query products that have the `featured` column set to `1` (or `true`). We will fetch up to 8 of these products.

    public function index()
    {
        // Fetch up to 8 products where "featured" status is 1
        $fproducts = Product::where("featured",1)
                            ->get()
                            ->take(8);
                            
        // ... other data fetching logic (like slides, on-sale products) ...
        
        // Return the featured products to the view
        return view("index", compact("fproducts", "slides", "sproducts")); 
        // Assuming "slides" and "sproducts" are also passed
    }

  2. Update the Frontend View (`index.blade.php`)

    Open `resources/views/index.blade.php`. Locate the section designated for "Featured Products" and replace the static content with a dynamic loop using the `$fproducts` collection.

    <div class="product-tabs-content">
        <div class="tab-content">
            <div class="tab-pane fade show active" id="tab-featured">
                <div class="swiper-container">
                    <div class="swiper-wrapper">
                        @foreach ($fproducts as $product)
                        <div class="swiper-slide">
                            <div class="single-product-02">
                                <div class="product-images">
                                    <a href="{{ route("shop.product.details", ["product_slug" => $product->slug]) }}">
                                        <img src="{{ asset("uploads/products") }}/{{ $product->image }}" 
                                             width="270" height="303" alt="{{ $product->name }}">
                                    </a>
                                </div>
                                <div class="product-content">
                                    <h4 class="title">
                                        <a href="{{ route("shop.product.details", ["product_slug" => $product->slug]) }}">
                                            {{ $product->name }}
                                        </a>
                                    </h4>
                                    <div class="price">
                                        <span class="sale-price">
                                            @if ($product->sale_price)
                                            ${{ $product->sale_price }}
                                            <s class="sprice">${{ $product->regular_price }}</s>
                                            @else
                                            ${{ $product->regular_price }}
                                            @endif
                                        </span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </div>

Verification and Testing ⭐

Ensure you have some products marked as Featured in your database (featured = 1). Refresh the Home Page. The section for Featured Products should now display the selected items, and they will be automatically removed if the featured status is turned off in the admin panel.