I know that current Play! distribution has a helper for Bootstrap 1.4. What should I do if I want to use the current version of Bootstrap?
I'm using the 2.0.1 twitter bootstrap with Play 2.0. You can download a specific version here: https://github.com/twitter/bootstrap/tags . Once you download the twitter bootstrap you have two options:
you can choose to just use the bootstrap.min.css
(and bootstrap-responsive.css
) and bootstrap.min.js
, all these file can be placed in the public folder.
or you can use the less files for the css. If you want to use the less files you make the following package (in the root of your app folder):
assets.stylesheets.bootstrap
And in you build scala you define that these .less files should be compiled:
// Only compile the bootstrap bootstrap.less file and any other *.less file in the stylesheets directory
def customLessEntryPoints(base: File): PathFinder = (
(base / "app" / "assets" / "stylesheets" / "bootstrap" * "bootstrap.less") +++
(base / "app" / "assets" / "stylesheets" / "bootstrap" * "responsive.less") +++
(base / "app" / "assets" / "stylesheets" * "*.less")
)
val main = PlayProject(appName, appVersion, appDependencies, mainLang = JAVA).settings(
// Add your own project settings here
lessEntryPoints <<= baseDirectory(customLessEntryPoints)
)
And then you can include it in your templats:
<link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/bootstrap/bootstrap.min.css")" />
<link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/bootstrap/responsive.min.css")" />
EDIT: 2012-09-17: If you plan to build Play from source, follow this tutorial the Play wiki page: https://github.com/playframework/Play20/wiki/Tips
EDIT: 2012-09-21:
When using the bootstrap you always have to make a choice whether you would change the folder images
or adding a route to the two static images used by the bootstrap:
EDIT: 2013-03-11:
As xref pointed, I made a mistake: img
must be images
:
GET /assets/img/glyphicons-halflings-white.png controllers.Assets.at(path="/public", file="/images/glyphicons-halflings-white.png")
GET /assets/img/glyphicons-halflings.png controllers.Assets.at(path="/public", file="/images/glyphicons-halflings.png")