3 min readApr 6, 2021

Laravel 8 Breadcrumbs Example

In this tutorial, We will learn how to generate Laravel Breadcrumbs package by Dave James Miller .

Install Laravel Project

For Laravel 8 Breadcrumbs demo we require to download a fresh laravel app.

Run the command to induct fresh Laravel project.

composer create-project laravel/laravel laravel-breadcrumbs --prefer-dist

Install Laravel Breadcrumbs Package by Dave James Miller

Run the under-mentioned command to install Laravel Breadcrumbs package by Dave James Miller.

composer require davejamesmiller/laravel-breadcrumbs:5.x

This will update composer.json and install the package into the vendor/ directory.

Configure Package

php artisan vendor:publish --tag=breadcrumbs-config

Define Route

Open routes/web.php and insert the following code.

<?php
use Illuminate\Support\Facades\Route;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('/', function () {
return view('welcome');
});Route::get('/home', [App\Http\Controllers\ExampleController::class, 'home'])->name('home');Route::get('/products', [App\Http\Controllers\ExampleController::class, 'products'])->name('products');Route::get('/product/detail', [App\Http\Controllers\ExampleController::class, 'productDetail'])->name('product.detail');

Define Controller

Please create a new controller, and It will have the logic to display the project’s list. Run the command to create the controller.

php artisan make:controller ExampleController<?phpnamespace App\Http\Controllers;use Illuminate\Http\Request;use function Ramsey\Uuid\v1;class ExampleController extends Controller{/*** Display a listing of the resource.** @return \Illuminate\Http\Response*/public function home() {return view('home');}public function products() {
return view('products');
}public function productDetail() {
return view('product-detail');
}
}

Display Home in Blade View Template

Generate a blade file resources/views/home.blade.php then insert the following code inside.

<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title></title><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"><link href="{{ asset('css/app.css') }}" rel="stylesheet" type="text/css" /></head>
<body>
<br><div class="breadcrumb-section"><div class="container">{{ Breadcrumbs::render('home') }}
</div>
</div>
</body>
</html>

Display Products in Blade View Template

Generate a blade file resources/views/products.blade.php then insert the following code inside.

<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title></title><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"><link href="{{ asset('css/app.css') }}" rel="stylesheet" type="text/css" /></head>
<body>
<br><div class="breadcrumb-section"><div class="container">{{ Breadcrumbs::render('products') }}</div>
</div>
</body>
</html>

Display Product Detail in Blade View Template

Generate a blade file resources/views/product-detail.blade.php then insert the following code inside.

<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title></title><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"><link href="{{ asset('css/app.css') }}" rel="stylesheet" type="text/css" /></head>
<body>
<br><div class="breadcrumb-section"><div class="container">{{ Breadcrumbs::render('product_name') }}
</div>
</div>
</body>
</html>

Define your breadcrumbs

Create a file called routes/breadcrumbs.php that looks like this:

<?php
use DaveJamesMiller\Breadcrumbs\Facades\Breadcrumbs;// home
Breadcrumbs::for('home', function ($trail) {
$trail->push('Home', route('home'));
});// home > productsBreadcrumbs::for('products', function ($trail) {
$trail->parent('home');
$trail->push('products', route('products'));
});// home > products > product detailBreadcrumbs::for('product_name', function ($trail) {$trail->parent('products');
$trail->push('product_name', route('product.detail'));
});

Output