Tag: TwitterBootstrapWithRails

目次

参考情報

Bootstrap3を使うには

twitter-bootstrap-rails 2.2.6

概要

  • css版とless版のインストール方法がことなる。
  • less版をいれたほうがカスタマイズが容易っぽい。

インストール

  • Gemfileの編集し以下の3行を追加
    gem "therubyracer"
    gem "less-rails" #Sprockets (what Rails 3.1 uses for its asset pipeline) supports LESS
    gem 'twitter-bootstrap-rails'
    
  • bundle installの実行
    bundle install --path vendor/bundle
  • cssなどの生成
    bundle exec rails generate bootstrap:install
  • layoutの生成(固定レイアウトの例)
    bundle exec rails g bootstrap:layout application fixed

修正

  • そのままだとヘッダー部分が本文と重なっており萎える。bootstrap_and_overrides.css.lessに以下を追加。
    body {
         padding-top: 60px;
    }
    
    

$(window).loadとか$(window).readyが動かない

  • 作成したapplication.html.erbの一番下でjavascriptをincludeしているのが原因っぽい。headタグ内部にもっていくと解決する。

トップ   編集 凍結 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS
Last-modified: 2016-04-13 (水) 16:48:26 (1069d)