外部化とは
ヘッダーやフッター、グローバルナビゲーションの部分などの
共通する部分を部品化することを指します
これによって大掛かりなプロジェクトなどで何千ページのWEBサイトを作成する際には
共通する部分は呼び出すだけで済むため、作業の効率化につながります
@yieldとは
- @sectionの内容を呼び出します。
@sectionとは
まずは実際の例をご覧ください
@yield('content')
@section('content')
<p>ここにブログやニュース記事、企業情報、コンテンツ情報を記述します</p>
@endsection
- @sectionと@endsectionで囲まれた内容を@yieldで呼び出すことができます
- @sectionで囲まれた部分は@yieldで呼び出さない限り表示されません
- @sectionに任意の名前を付けることで@yieldによりその名前の@sectionを呼び出すことができます
実際の使い方
headタグやmetaタグなど共通要素を記述した親となるテンプレートファイルを作成します
例：resources/views/layouts/template.blade.php
<!DOCTYPE html>
<html lang="ja">
<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>@yield('title')</title>
</head>
<body>
@yield('content')
</body>
</html>
親テンプレートは他のbladeファイルで呼び出して使います
外部化ファイルの作り方
-
共通テンプレート（親）を呼び出すbladeファイルを作成します
resources/views/contents/index.blade.php -
bladeファイルへ親テンプレートを継承する@extendsを記述します
-
bladeファイルに親テンプレートが読み込まれます
-
親テンプレートの@yieldからsectionが呼び出されます
{{-- layoutsフォルダのapp.blade.phpを継承 --}}
@extends('layouts.template')
{{-- @yield('title')へtitleタグの値を代入されブラウザのタイトルが変更される --}}
@section('title', '記事一覧')
{{-- 呼び出された親要素の@yield('content')に以下のレイアウトを代入される --}}
@section('content')
<p>ここにブログやニュース記事、企業情報、コンテンツ情報を記述します</p>
@endsection