I thought I would split the header from my blade templates and have the header and footer included separately. It worked to put my header.blade.php in layouts/partials/, and then in the next template, it extends layouts.partials.header. It works, but the stylesheets and scripts are loaded after the content. How should it be organized in a way that runs fast and in the correct order?
header.blade.php
@section('header')
<!DOCTYPE html>
<html>
<head>
<title>
@section('title')
@show
</title>
<script type="text/javascript" src="{{ asset('bower/jquery/dist/jquery.min.js') }}"></script>
<link href="{{ asset('bower/bootstrap/dist/css/bootstrap.min.css') }}" rel="stylesheet">
<script type="text/javascript" src="{{ asset('bower/bootstrap/dist/js/bootstrap.min.js') }}"></script>
<script type="text/javascript" src="{{ asset('bower/ckeditor/ckeditor.js') }}"></script>
<link href="{{ asset('css/default.css') }}" rel="stylesheet">
</head>
<body>
@show
@section('footer')
@section('scripts')
@show
</body>
</html>
@show
master.blade.php
@extends('layouts.partials.header')
@yield('header')
<div class="container">
@section('topNav')
<div class="row center-block text-center indexWrapper">
<div class="indexNav">
<ul class="text-right">
<li><a href="{{URL::to('people')}}">People</a></li>
<li><a href="{{URL::to('bulletin')}}">Bulletin</a></li>
<li><a href="{{URL::to('current')}}">Current</a></li>
<li><a href="{{URL::to('finished')}}">Finished</a></li>
</ul>
</div>
<div class="indexHeading">
<h1 class="indexH1">
@section('navTitle')
@show
</h1>
</div>
<div class="clearfix"></div>
</div>
@show
@yield('content')
<div class="center-block login">
@yield('login')
</div>
</div>
@section('scripts')
@show
</body>
</html>
home.blade.php
@extends('layouts.master')
@section('title')
@parent
::Home
@stop
@section('navTitle')
@parent
Mumble
@stop
@section('login')
@if (Auth::check())
<div class="col-md-12 panel panel-default">
<div class="panel-body text-center">
<h4>Welcome back <em>{{ Auth::user()->name }}</em></h4>
</div>
</div>
<div class="text-center">
<a href="logout" class="btn btn-warning">Logout</a>
</div>
@else
@if($error)
<div class="alert alert-danger">
{{ $error }}
</div>
@endif
@if($errors->first('email'))
<div class="alert alert-warning">
{{ $errors->first('email') }}
</div>
@endif
@if($errors->first('password'))
<div class="alert alert-warning">
{{ $errors->first('password') }}
</div>
@endif
{{ Form::open(array('url' => '')) }}
<div class="form-group">
{{Form::label('email', 'Email')}}
{{Form::text('email', Input::old('email'),array('class'=>'form-control','placeholder'=>'enter email'))}}
</div>
<div class="form-group">
{{Form::label('password', 'Password')}}
{{Form::password('password',array('class'=>'form-control','placeholder'=>'enter password'))}}
</div>
<div class="form-group">
{{ Form::checkbox('remember','remember') }}
<span style="margin-left:5px;">Remember Me</span>
</div>
<div class="text-center">
{{ Form::submit('Login',array('class'=>'btn btn-default')) }}
</div>
{{ Form::close() }}
@endif
@stop
@section('scripts')
<script type="text/javascript">
$(document).ready(function(){
//$('.indexWrapper').addClass('homeCenter');
//$('.indexWrapper').css( 'margin-top', '25%' );
});
</script>
@stop
How modular should things be in blade? Am I breaking it into too many pieces? The scripts run slow when they are in the "footer" (defined in the header partial, I guess I should rename that), but I just want to know if there is a way to do this properly.
