Laravelでは、ヘッダーやフッターを共通パーツ化することで、サイト全体の保守性・拡張性を大幅に向上させることができます。この記事では、具体的な手順とコード例を交えながら、わかりやすく解説します。
共通レイアウトファイルを作成する
まず、共通で使用するレイアウトファイルを作成します。
resources/views/layouts フォルダに、app.blade.php というファイルを作成しましょう。
<!-- resources/views/layouts/app.blade.php -->
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>@yield('title', 'デフォルトタイトル')</title>
</head>
<body>
<!-- ヘッダー読み込み -->
@include('partials.header')
<!-- メインコンテンツ -->
<main>
@yield('content')
</main>
<!-- フッター読み込み -->
@include('partials.footer')
</body>
</html>
ここでは、@include ディレクティブを使って、別ファイルとして分割したヘッダー・フッターを読み込んでいます。
また、@yield(‘title’) と @yield(‘content’) を使用して、各ページごとに動的な内容を差し込めるようにしています。
ヘッダーとフッターのパーツファイルを作成する
次に、ヘッダーとフッターのパーツファイルをそれぞれ作成します。
resources/views/partials フォルダに、以下のファイルを作成しましょう。
ヘッダーファイル
<!-- resources/views/partials/header.blade.php -->
<header>
<h1>サイトのヘッダー</h1>
<nav>
<ul>
<li><a href="/">ホーム</a></li>
<li><a href="/about">会社概要</a></li>
</ul>
</nav>
</header>
フッターファイル
<!-- resources/views/partials/footer.blade.php -->
<footer>
<p>© 2025 サイト名 All rights reserved.</p>
</footer>
このように共通部分をパーツ化しておくことで、デザイン変更があった場合も、1箇所修正するだけで全ページに反映されるようになります。
各ページで共通レイアウトを使用する
個別のページファイルでは、共通レイアウトを継承して、中身だけを差し込むようにします。
例えば、トップページ用に resources/views/home.blade.php を作成すると、次のようになります。
<!-- resources/views/home.blade.php -->
@extends('layouts.app')
@section('title', 'ホームページ')
@section('content')
<h2>ようこそ!</h2>
<p>ここがホームページです。</p>
@endsection
@extends(‘layouts.app’) で共通レイアウトを指定し、@section(‘title’) と @section(‘content’) で、それぞれタイトルと本文コンテンツを定義しています。
まとめ
Laravelでは、Bladeテンプレートエンジンを活用して、簡単にヘッダーやフッターを共通化することができます。
サイト全体の統一感を保ちつつ、効率よく管理できるようになるので、ぜひ積極的に取り入れていきましょう。