Posted at

Laravel5にtwitter bootstrapを導入する

More than 3 years have passed since last update.

実はLaravel5には最初からBootstrap3が導入されています。

以下の場所に格納されています。

public/

└── css
└── app.css

resources/
└── assets
└── less
└── bootstrap
└── *.less

Bootstrapはlessというcssを拡張した言語で書かれており、そのlessファイルをcssにコンパイルしたものがapp.cssです。

Boostrapを使うためには、

// resources/views/app.blade.php

<!DOCTYPE HTML>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>My Blog</title>

<!-- CSS --><!-- 追加 -->
<link href="/css/app.css" rel="stylesheet">
</head>

<body>
<!-- Scripts --><!-- 追加 -->
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.min.js"></script>
</body>
</html>

とすればokです。