Include Bootstrap in Laravel
This is the top/header part of my currently running application's master layout:
<!-- app/views/layouts/master.blade.php -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="Simple CMS" />
<meta name="author" content="Sheikh Heera" />
<link rel="shortcut icon" href={{ assets("favicon.png") }} />
<title>LaraPress</title>
<!-- Bootstrap core CSS -->
<link href = {{ asset("bootstrap/css/bootstrap.css") }} rel="stylesheet" />
<!-- Custom styles for this template -->
<link href = {{ asset("bootstrap/css/sticky-footer-navbar.css") }} rel="stylesheet" />
<!-- Optional theme -->
<link rel="stylesheet" href="{{ asset('bootstrap/css/bootstrap-theme.min.css') }}">
</head>
Follow this approach and make your each view to extend the master layout like this:
<!-- app/views/user/show.blade.php -->
@extends('layouts.master')
@section('content')
<div class="panel panel-default">
<div class="panel-heading"><label>View User</label>
<a class ='pull-right' href="{{ Request::header('referer') }}">
<i class="glyphicon glyphicon-circle-arrow-left"></i> Go Back
</a>
</div>
This is a partial of my view (top part) which extends the master layout so it become a part of the master layout. Master layout is stored in app/views/layouts/
folder and name is master.blade.php
so, @extends('layouts.master') means to extend master.blade.php
from layouts
folder and it (name) could be anything, each view also must contains .blade
in the file name before the .php
.
Update for Laravel 7.*
Within terminal:
laravel new project
cd project
composer require laravel/ui
php artisan ui bootstrap
npm install && npm run dev
Then, in the HTML that you are working on, pull in both the CSS and JavaScript:
<!doctype html>
<html lang="en">
<head>
...
<link href="/css/app.css" rel="stylesheet">
</head>
<body>
....
<script src="/js/app.js"></script>
</body>
</html>
- Documentation for Laravel UI
@Svyat, hopefully, this answers your question as well.
Happy coding :)
I realize that this is old... but it was the top result that come up for me on Google. Hopefully this will help someone in the future.
If you are using Laravel 6.2,
Within terminal:
npm install bootstrap
Within app.scss:
@import "node_modules/bootstrap/scss/bootstrap";
In Terminal, run the following to generate /public/css/app.css file:
npm run dev
Within welcome.blade.php:
<link rel="stylesheet" href="/css/app.css">
Happy coding