Laravelのパンくずリスト(Breadcrumb)の実装（リンクとJSON-LD)

Laravelのパンくずリストを実装します（ついでにJSON-LDも出力します)
Laravel5.3でためしています。

超おすすめライブラリです。

環境
Laravel5.3
PHP5.6.x
davejamesmiller/laravel-breadcrumbs（https://github.com/davejamesmiller/laravel-breadcrumbs）

composerでインストール

composer require davejamesmiller/laravel-breadcrumbs

composer.jsonにdavejamesmiller/laravel-breadcrumbsが追加されていることを確認

    "require": {
        "php": ">=5.6.4",
        "laravel/framework": "5.3.*",
        "laravelcollective/html": "5.3.*",
        "davejamesmiller/laravel-breadcrumbs": "^3.0"
    },

config/app.phpに2箇所追記

'providers' => [
    DaveJamesMiller\Breadcrumbs\ServiceProvider::class,
],

'aliases' => [
    'Breadcrumbs' => DaveJamesMiller\Breadcrumbs\Facade::class,
],

パンくずリストの定義ファイルを作成します。公式ドキュメントにある以下のパスに作成

routes/breadcrumbs.php

<?php

Breadcrumbs::register('home', function($breadcrumbs)
{
    $breadcrumbs->push('ホーム', route('home'));
});

Breadcrumbs::register('search', function($breadcrumbs)
{
    $breadcrumbs->parent('home');
    $breadcrumbs->push('検索', route('search'));
});

テンプレートの作成
config/breadcrumbs.phpを作成

<?php
return [
    'view' => 'common/breadcrumbs',
];

続いて、resources/views/common/breadcrumbs.blade.phpを作成

@if ($breadcrumbs)
<ul class="breadcrumb">
    @foreach($breadcrumbs as $breadcrumb)
    @if(!$breadcrumb->last)
    <li><a href="{{ $breadcrumb->url }}">{{ $breadcrumb->title }}</a></li>
    @else
    <li>{{ $breadcrumb->title }}</li>
    @endif
    @endforeach
</ul>
@endif

ここまでで準備完了です。実際のテンプレートに記述してみます
テンプレ

resources/views/layouts/base.blade.php

<!DOCTYPE html>
<html lang="ja">
    <body>
    @yield('breadcrumbs')
    </body>
</html>

ページ用のテンプレート

@extends('layouts.base')
@section('breadcrumbs', Breadcrumbs::render('search'))

（略）

結果

引数を渡してみます
routes/breadcrumbs.php

<?php

Breadcrumbs::register('home', function($breadcrumbs)
{
    $breadcrumbs->push('ホーム', route('home'));
});

Breadcrumbs::register('search', function($breadcrumbs, $prefecture = null)
{
    $breadcrumbs->parent('home');
    if(!empty($prefecture)){
        $breadcrumbs->push($prefecture->name . 'の検索', '/search/prefecture' . $prefecture->id);
    }else{
        $breadcrumbs->push('検索', '/search');
    }
});

ページ用のテンプレート

@extends('layouts.base')
@section('breadcrumbs', Breadcrumbs::render('search', $prefecture))

（略）

結果

よいですね。

引数は可変長なのでいくつでもわたせます

@section('breadcrumbs', Breadcrumbs::render('search', $prefecture, $city, $town, $keyword))

パンくずを作成したので、JSON-LD(JSON for Linking Data)タグも出してみましょう。

resources/views/common/breadcrumbs.blade.phpに追記します

@if ($breadcrumbs)

<ul class="breadcrumb">
    @foreach($breadcrumbs as $breadcrumb)
    @if(!$breadcrumb->last)
    <li><a href="{{ $breadcrumb->url }}">{{ $breadcrumb->title }}</a></li>
    @else
    <li>{{ $breadcrumb->title }}</li>
    @endif
    @endforeach
</ul>

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement":
  [
    @foreach($breadcrumbs as $index => $breadcrumb)
    {
      "@type": "ListItem",
      "position": {{ $index + 1 }},
      "item":
      {
        "@id": "{{ $breadcrumb->url }}",
        "name": "{{ $breadcrumb->title }}"
      }
    }
    @if(!$breadcrumb->last)
    ,
    @endif
    @endforeach
  ]
}
</script>

@endif

出力結果はGoogleの構造化データチェックツールで確認しましょう

以上、簡単ですね。

こちらの記事もどうぞ