About Blade:
Blade is the default template engine for Laravel (since Laravel 2 in 2011). The syntax is originally inspired by the ASP.net Razor syntax and provides a cleaner way to write your templates. The main benefit of using Blade instead of plain PHP is to make it easier to re-use templates and split templates.
From the Laravel 5.4 docs:
Blade is the simple, yet powerful templating engine provided with Laravel. Unlike other popular PHP templating engines, Blade does not restrict you from using plain PHP code in your views. All Blade views are compiled into plain PHP code and cached until they are modified, meaning Blade adds essentially zero overhead to your application. [..] Two of the primary benefits of using Blade are template inheritance and sections. Blade view files use the .blade.php file extension and are typically stored in the resources/views directory.
Create and use your first Blade layout:
File struture :-
– resources
— views
— layout
—- default.blade.php
—- header.blade.php
—- footer.blade.php
—- sidebar.blade.php
— pages
—- home.blade.php
—- about.blade.php
Step 1: Create a default template and save it at resources/views/layouts/default.blade.php.
<!doctype html>
<html>
<head>
<!-- my head section goes here -->
<!-- my css and js goes here -->
<title>@yield('title')</title>
<style>
div.container {
width: 600px;
margin:0 auto;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover {
background-color: #111;
}
header, footer {
padding: 1em;
color: white;
background-color: black;
clear: left;
text-align: center;
width:500px;
}
.sidebar{
float: left;
max-width: 160px;
margin: 0;
padding: 1em;
background-color: #357b33;
height:300px;
}
.contents{
margin-left: 170px;
border-left: 1px solid gray;
padding: 1em;
overflow: hidden;
height: 300px;
}
</style>
</head>
<body>
<div class="container">
<header> @include('layouts.header') </header>
<div class="sidebar"> @include('layouts.sidebar') </div>
<div class="contents"> @yield('content') </div>
<footer> @include('layouts.footer') </footer>
</div>
</body>
</html>
Step 2: Create a new file in resources/views/layouts/header.blade.php
<ul>
<li><a href="{{URL::to('/')}}">Home</a></li>
<li><a href="{{URL::to('/about')}}">About</a></li>
</ul>
Step 3: create a new file in resources/views/layouts/footer.blade.php
<div id="footer">This is Footer</div>
Step 4: create a new file in resources/views/layouts/sidebar.blade.php
<h2>This is Sidebar</h2>
Step 5: create a new folder in resources/views/pages
Step 6: create a new file in resources/views/pages/home.blade.php
@extends('layouts.default')
@section('title', 'W3Programmers Home Page')
@section('content')
<h2>This is my home page</h2>
@stop
Step 7: create a new file in resources/views/pages/about.blade.php
@extends('layouts.default')
@section('title', 'w3Programmers About Page')
@section('content')
<h2>This is about page</h2>
@stop
some of code means we are using: –
- @yield is used to display the value
- @section is used to define a section named
- @endsection is used to end section
- @include :- to render a view into another view. The rendered view will automatically inherit all of the data from the current view
- @extends directive to specify which layout the child view should “inherit”.
Now we need to link these pages in laravel routing
Route::get('/', function () {
return view('pages.home');
});
Route::get('/about', function () {
return view('pages.about');
});
Visit the following URL to view the example.
http://localhost:8000/
Laravel Blade Templating
Conditional Statements:
Laravel provides @if, @elseif, @else, @endif, @unless and @endunless statements. Create a function called student in Your homeController class as like:
<?php
namespace test\Http\Controllers;
use Illuminate\Http\Request;
use test\Http\Requests;
class homeController extends Controller
{
//
public function index(){
$name="Masud Alam";
$date=date('Y-m-d');
return view('home',compact('name', 'date'));
}
public function student($age=25){
return view('age')->with(['age'=>$age]);
}
}
Change your routes.php like this:
Route::get('/student', 'homeController@student');
Now Create age.blade.php file in resources/views/ like this:
@extends('layouts.default')
@section('title', 'w3programmers: CSS Fixed Layout')
@section('sidebar')
@endsection
@section('content')
@if ($age>0 && $age<=15)
<p>You're child</p>
@elseif ($age>15 && $age<=25)
<p>You're Young</p>
@elseif ($age > 25 && $age <= 40)
<p>You're Adult</p>
@else
<p>You're Old Man!</p>
@endif
@unless ($age <=0)
<p>you are ...</p>
@endunless
@endsection
Visit the following URL to view the example.
http://localhost:8000/student
Larvel Blade if elseif else and unless example
Loops:
Laravel provides @for, @foreach, @forelse and @while loops. Change student function in your homeController Class as like:
<?php
namespace test\Http\Controllers;
use Illuminate\Http\Request;
use test\Http\Requests;
class homeController extends Controller
{
//
public function index(){
$name="Masud Alam";
$date=date('Y-m-d');
return view('home',compact('name', 'date'));
}
public function student($age=4){
$students=['Tawhid','Dipu','Rocky','Mainul'];
return view('students')->with(['age'=>$age,'students'=>$students]);
}
}
Now Create students.blade.php file in resources/views/ like this:
@extends('layouts.default')
@section('title', 'w3programmers: CSS Fixed Layout')
@section('sidebar')
@endsection
@section('content')
@for ($i = 0; $i < 3; $i++)
{{ $i }}
@endfor
@foreach ($students as $student)
<p> {{ $student }}</p>
@endforeach
<ul>
@forelse ($students as $student)
<li>{{ $student }}</li>
@empty
<p>No Number</p>
@endforelse
</ul>
@while ($age > 0 && $age--)
<p>Your Age is {{ $age }}</p>
@endwhile
@endsection
Visit the following URL to view the example.
http://localhost:8000/student
Laravel Blade for, foreach, endforeach, forelse end forelse example
Hi, My name is Masud Alam, love to work with Open Source Technologies, living in Dhaka, Bangladesh. I’m a Certified Engineer on ZEND PHP 5.3, I served my first five years a number of leadership positions at Winux Soft Ltd, SSL Wireless Ltd, Canadian International Development Agency (CIDA), World Vision, Care Bangladesh, Helen Keller, US AID and MAX Group where I worked on ERP software and web development., but now i’m a founder and CEO of TechBeeo Software Company Ltd. I’m also a Course Instructor of ZCPE PHP 7 Certification and professional web development course at w3programmers Training Institute – a leading Training Institute in the country.
hatur nuhun Masud Alam, abdi urang sunda ti Indonesia. Mangfaat pisan postinganna
Ofcourse,a very helpful tutorial.Thank you