Step 1: tạo route about

  • Hiệu chỉnh file routes/web.php
Route::get('/san-pham', 'Frontend\FrontendController@product')->name('frontend.product');

Step 2: viết code action

Viết code cho action product():

/**
 * Action hiển thị danh sách Sản phẩm
 */
public function product(Request $request)
{
    // Query tìm danh sách sản phẩm
    $danhsachsanpham = $this->searchSanPham($request);

    // Query Lấy các hình ảnh liên quan của các Sản phẩm đã được lọc
    $danhsachhinhanhlienquan = DB::table('cusc_hinhanh')
                            ->whereIn('sp_ma', $danhsachsanpham->pluck('sp_ma')->toArray())
                            ->get();

    // Query danh sách Loại
    $danhsachloai = Loai::all();

    // Query danh sách màu
    $danhsachmau = Mau::all();

    // Hiển thị view `frontend.index` với dữ liệu truyền vào
    return view('frontend.pages.product')
        ->with('danhsachsanpham', $danhsachsanpham)
        ->with('danhsachhinhanhlienquan', $danhsachhinhanhlienquan)
        ->with('danhsachmau', $danhsachmau)
        ->with('danhsachloai', $danhsachloai);
}
Tạo view resources/views/frontend/pages/product.blade.php
{{-- View này sẽ kế thừa giao diện từ `frontend.layouts.master` --}}
@extends('frontend.layouts.master')

{{-- Thay thế nội dung vào Placeholder `title` của view `frontend.layouts.master` --}}
@section('title')
Danh sách sản phẩm Shop Hoa tươi - Sunshine
@endsection

{{-- Thay thế nội dung vào Placeholder `custom-css` của view `frontend.layouts.master` --}}
@section('custom-css')
@endsection

{{-- Thay thế nội dung vào Placeholder `main-content` của view `frontend.layouts.master` --}}
@section('main-content')

@include('frontend.widgets.product-list', [$data = $danhsachsanpham])

@endsection

{{-- Thay thế nội dung vào Placeholder `custom-scripts` của view `frontend.layouts.master` --}}
@section('custom-scripts')
@endsection
 

Step 3: gắn liên kết cho menu about trên header

Hiệu chỉnh file resources/views/frontend/layouts/partials/header.blade.php:

<!-- Menu desktop -->
<div class="menu-desktop">
  <ul class="main-menu">
    <li class="{{ Request::is('') ? 'active-menu' : '' }}">
      <a href="{{ route('frontend.home') }}">Trang chủ</a>
    </li>

    <li class="{{ Request::is('san-pham') ? 'active-menu' : '' }}">
      <a href="{{ route('frontend.product') }}">Sản phẩm</a>
    </li>

    <li class="{{ Request::is('gioi-thieu') ? 'active-menu' : '' }}">
      <a href="{{ route('frontend.about') }}">Giới thiệu</a>
    </li>

    <li class="{{ Request::is('lien-he') ? 'active-menu' : '' }}">
      <a href="{{ route('frontend.contact') }}">Liên hệ</a>
    </li>
  </ul>
</div>