tkymtk's blog

Ruby on Rails及びその周辺について調べたこと。Do whatever you want to do at your own pace.

bootstrap-generators gemを使う。

はじめに

Railstwitter-bootstrapを使う方法はいくつかあります。gemを使って導入する場合、

  • lessで使いたいときは、twitter-bootstrap-rails
  • sassで使いたいときは、bootstrap-sass

を選択するのがほとんどだと思います。 twitter-bootstrap-railsにはジェネレータの機能がありますが、bootstrap-sassにはありません。 なので、sass環境でbootstrapのテンプレートを生成できる、bootstrap-generatorsというgemを使ってみたいと思います。

bootstrap-generators の特徴
  • sass
  • テンプレートを生成できる。

インストール

Gemfileに次のラインを追加:

gem 'bootstrap-generators'

bundle installを実行:

 bundle install

ジェネレータの実行

rails generate bootstrap:install -f

これで、コントローラやスキャッフォールドをジェネレートするときに、Bootstrap のテンプレートが適用されます。

rails generate scaffold Book title:string author:string rating:integer description:text

色やグリッド、フォントなど、その他の設定もアセットフォルダにあるbootstrap-variables.[less|scss]を編集することで変更することができます。

f:id:tkymtk:20140128113824p:plain

※ 画像はデータ追加後です。

Simple form と使う。

Simple Formと使う場合は、bootstrap-generatorのインストール後にsimple_formをインストールします。
このとき、

lib/templates/erb/scaffold/_form.html.erb

を上書きするか聞かれた場合は、上書きしてください。

f:id:tkymtk:20140128113702p:plain

※ 画像ではボタンの色を変更してあります。

リンク

間違いがあれば、ご指摘下さると幸いです。