Tự học Laravel: (5) Tạo Layout sử dụng Blade

Until the last time , about page, contact page has been created. These two pages contain a lot of common HTML. This time, I will cut out this common part and create a layout file so that it can be shared by two pages.

LAYOUT VIEW

Create resouces/views/layout.blade.php in a text editor.

<!DOCTYPE HTML>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>My Blog</title>
</head>
<body> 
    @yield('content') 
</body>
</html>

I entered @yield (‘content’) in the body tag. This is the place where the actual content of the page flows.

The ‘content’ passed as an argument is the name for specifying the location when there are multiple @yields.

ABOUT PAGE VIEW

Modify resouces/views/pages/about.blade.php

<!DOCTYPE HTML>
<html>
<head>
    <title>About</title>
</head>
<body>
    <h1>About Me: {{ $first_name }} {{ $last_name }}</h1>
</body>
</html>
@extends('layout')
 
@section('content')
    <h1>About Me: {{ $first_name }} {{ $last_name }}</h1>
@endsection

We tell @extends to extend “layout” (layout.blade.php).

@section (‘content’) to @endsection are the parts to be poured into the @yield (‘content’) part of the layout view.

I was able to wipe out the HTML and move it into the layout view. 
Now you can use the layout view from other views.

EXERCISE

  • Please modify the view on the contact page to use the layout view.
  • There are also if, foreach, and include statements in the blade. Please check the following site http://laravel.com/docs/master/blade

SUMMARY

You can now do the following:

  • Create a common layout view
  • Using blade’s @yield, @extends, @section

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.