"Go" installation and use of bootstrap in rails

Transferred from: http://blog.csdn.net/lissdy/article/details/9195651seeing the front-end siege artists start using bootstrap to create Web pages, they also want to learn to use bootstrap in the rails they are learning recently.

The specific installation uses the following procedures:

1. Create Rails Engineering

Rails New Usedschool

2. Build Scaffolding

Rails g scaffold Item title:string Description:text--skip-stylesheets

3. Application migration

Rake Db:migrate

4. Modify the Gemfile file to add the bootstrap related package to be installed

5, install the relevant package

Bundle Install

Here I have a problem with the Ruby version limitation, and the bootstrap related package was successfully installed after Ruby was upgraded.

For specific upgrade actions, please see here: Ruby upgrade

6. Run Rails g bootstrap:install to generate bootstrap related files

So far, the bootstrap has been installed successfully, see below how to use

7. Modify the Application.html.erb layout file

This step to modify the template, after all, bootstrap specific usage is not familiar with, so direct take doctrine, to find a template to apply.

Template http://www.bootcss.com/examples/fluid.html

<! DOCTYPE html>"Application",: Media =" All"%> <%= Javascript_include_tag"Application"%> <%= csrf_meta_tags%>class="navbar navbar-inverse navbar-fixed-top"> <divclass="Navbar-inner"> <divclass="Container-fluid"> <button type="Button" class="btn Btn-navbar"data-toggle="collapse"data-target=". Nav-collapse"> <spanclass="Icon-bar"></span> <spanclass="Icon-bar"></span> <spanclass="Icon-bar"></span> </button> <aclass="Brand"href="#"> Two </a> <divclass="nav-collapse collapse"> <pclass="Navbar-text pull-right">loggedinchAs <a href="#" class="Navbar-link">Username</a> </p> <ulclass="nav"> <liclass="Active"><a href="#">Home</a></li> <li><a href="#about">About</a></li> <li><a href="#contact">Contact</a></li> </ul> </div><!--/.nav-collapse-</div&      Gt </div> </div> <divclass="Container-fluid"> <divclass="Row-fluid"> <divclass="span3"> <divclass="Well Sidebar-nav"> <ulclass="nav nav-list"> <liclass="Nav-header">Sidebar</li> <liclass="Active"><a href="#">Link</a></li> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> <liclass="Nav-header">Sidebar</li> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> <liclass="Nav-header">Sidebar</li> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> <li><a href="#">Link</a></li> </ul> </div><!--/.well--</div><!--/ Span--> <divclass="Span9"> <%=yield%> </div><!--/row--> </div><!--/span--> </div><!--/row--> Le JavaScript==================================================-<!--Placed at the end of the document so the pages load F Aster--<script src="//cdnjs.bootcss.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="//cdnjs.bootcss.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script> </body>
 
8. Modify the item overall page style
Rails g bootstrap:themed items-f
Operation Result:
What's the swelling like? It's a lot better than the direct build of rails.
"Go" installation and use of bootstrap in rails