FahmidasClassroom

Learn by easy steps

You Are Here

Bootstrap Laravel
Framework

How to use bootstrap in Laravel

2 Comments

Steps:

1. Create a Controller

php artisan make:controller TestController

2. Copy the bootstrap folder in laravel public directory

3. Create a master view file for application layout and add the bootstrap link.

<link rel="stylesheet" href="/css/bootstrap.css">
<script src="/js/jquery-2.2.4.min.js"></script>
<script src="/js/bootstrap.min.js"></script>

4. Add the following code in the master view file

<body>
<div class="container">
<div class="col-md-12">
@yield('content')
</div>
<div class="col-md-3">
@section('menu')
<ul>
<li> Home </li>
<li> Services </li>
<li> Contact Us </li>
</ul>
</div>
<div class="col-md-9">
@section('main')
@show
</div>
</div>
</body>

5. Add the method index()

public function index()
{
     return view('test');
}

6. Add the following code in the test view file

@extends('master')
 
@section('content')
<div style="background-color:#7CC5DB">
<h1>Welcome to Laravel</h1>
</div>
@endsection
@section('menu')
<h4>Menu</h4>
@parent
@endsection
@section('main')
<h4> Main Content </h4>
<p> Site content will be added here………
@endsection

7. Add route for controller in web.php

Route::get('/test', 'TestController@index') ;

8. Execute the controller

The full steps are given in the following video tutorial.