Reputation: 343
How can I make one layout for all pages? For example I have:
header.blade.php file with my header.
<!doctype html>
<head>
<meta charset="utf-8">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js">
</script>
</head>
<body>
And in login.blade.php:
@extends('layouts.header')
<form method="POST" action="/auth/login">
{!! csrf_field() !!}
<div>
Email
<input type="email" name="email" value="{{ old('email') }}">
</div>
<div>
Password
<input type="password" name="password" id="password">
</div>
<div>
<input type="checkbox" name="remember"> Remember Me
</div>
<div>
<button type="submit">Login</button>
</div>
</form>
</body>
But when I open login page my header prints after login? Why ?
Like this:
Maybe exists easier way to use one header/footer for all pages? For example:
@extends('layouts.header')
~~somethingfile.php~~
@extends('layouts.footer')
Thanks in advance
Upvotes: 0
Views: 1834
Reputation: 73301
You would normally create a layout file like this:
<html>
<head>
<title>App</title>
</head>
<body>
@yield('header')
<div class="container">
@yield('content')
</div>
@yield('footer')
</body>
</html>
And every other file extends this file with @extends('layout.layout')
, having its own contents in @section
.
@section('content')
// content
@endsection
or
@section('header')
// content
@endsection
depending on the purpose, and so on.
Have a look on the documentation
Upvotes: 3
Reputation: 179
In the end of the header file content insert @yield('content')
Then when you can write this
@extends('layouts.header') @section('content') ~somethings~ @stop @extends('layouts.footer')
I think this may help you.
Upvotes: 2