人気のPHPoWEBアプリケーションフレームワークLaravelのTipsを記録していきます

Laravelのパンくずリストlaravel-breadcrumbsを使用してページタイトルとパンくずを表示させる

● laravel-breadcrumbsのインストール

composer require davejamesmiller/laravel-breadcrumbs:5.x

● パンくずリストのデータを定義する

routes/breadcrumbs.php を以下の内容で作成します

<?php

// Home
Breadcrumbs::for('home', function ($trail) {
    $trail->push('Home', route('home'));
});

// Home > About
Breadcrumbs::for('about', function ($trail) {
    $trail->parent('home');
    $trail->push('About', route('about'));
});

● 設定ファイルを生成する

次の設定ファイルを生成コマンドを実行します

php artisan vendor:publish --provider="DaveJamesMiller\Breadcrumbs\BreadcrumbsServiceProvider"

● パンくずリストを表示する

ビューファイル(XXXXX.blade.php)に以下のように記述します

{{ Breadcrumbs::render('home') }}

もしくは、Route::currentRouteName() で現在のルーティングが取得できるので

{{ Breadcrumbs::render(Route::currentRouteName()) }}

としておくとビューファイルは触らなくてもいいので楽です。(レイアウトファイルにパンくずを設置してある場合はこちらがおすすめです。)

● パンくずリストをカスタマイズする

自作のパンくずリストテンプレートを使用するには config/breadcrumbs.php を編集します

25行目を次のように書き換えます

###    'view' => 'breadcrumbs::bootstrap4',
    'view' => 'my_breadcrumbs',

すると、テンプレートファイルviews/breadcrumbs.blade.phpを見に行くようになります。

テンプレートファイルを用意する

views/breadcrumbs.blade.php

(以下は例です。適宜書き換えてください。)

@if (count($breadcrumbs))
    <ol class="navbar__breadcrumb breadcrumb d-none d-sm-flex">
        @foreach ($breadcrumbs as $breadcrumb)
            @if ($breadcrumb->url && !$loop->last)
                <li class="breadcrumb-item"><a href="{{ $breadcrumb->url }}">{{ $breadcrumb->title }}</a></li>
            @else
                <li class="breadcrumb-item active">{{ $breadcrumb->title }}</li>
            @endif
        @endforeach
    </ol>
@endif

以上です。 とても簡単にパンくずリストが出来るのでLaravelを使っている場合は必須ともいえるでしょう。

● パンくずの一番後ろのテキストをページタイトルとして表示する

これも便利です。blade.php ファイルにページタイトルを記述しなくても自動的にセットされます。

    <title>{{ ($breadcrumb = Breadcrumbs::current()) ? $breadcrumb->title : 'No Name' }}</title>

関連エントリー

No.1302
11/13 16:43

edit

Laravel