How to integrate a Wrap Bootstrap theme into an Rails application?

Question

I have bought a twitter bootstrap theme from wrapbootstrap. I already have a functional rails application. Now, I want to design my application by integrating the bootstrap

Answer 1

First check this screencast:

http://railscasts.com/episodes/328-twitter-bootstrap-basics

then I would add a bootstrap gem like bootstrap-sass, then add the JS files through the gem by adding them to the manifest, something like this:

//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require_tree .

then i would get the css files that you bought from wrapboostrap and place them in you assets/stylesheets folder, then add the necesary markup and clases to your app this is how ive done it before.

hope it helps

EDIT:

Markup:

Check the template you downloaded, lets start with the navbar for example

Code from template:

    

        

            
                
                
                
            
            

                Gaia Business
                

                    

                        
Home
                        
About
                        
Service
                        
FAQ
                        
Contact
                        

                          Dropdown 
                          

                            
Dropdown 1
                            
Dropdown 2
                            
Dropdown 3
                            

                            
Nav header
                            
Dropdown 4
                            
Dropdown 5
                          
                        
                    
                

            

        

    

Now you need to place yourself in your app, if the navbar shows in every view on your app, you should mention it on the layouts/application.html.erb something like this:

  
  <%= stylesheet_link_tag    "application", :media => "all" %>
  <%= javascript_include_tag "application" %>
  <%= csrf_meta_tags %>




<%= render :partial => 'layouts/navbar' %>
<%= yield %>

and last, do your navbar partial

_navbar.html.erb:

    

        

            
                
                
                
            
            

                <%= link_to "Your app", root_path, :class => "brand" %> 
                

                    

                        
 > <%= link_to (t "navbar.home"), root_path%>
                        
> <%= link_to (t "navbar.know"), static_know_path%>
  
                        
> <%= link_to (t "navbar.buy"), static_buy_path%>
                       
                        
> <%= link_to "FAQ", static_faq_path%>
           
                        
> <%= link_to (t "navbar.contact"), static_contact_path%>

                        
                    
                    

                        
<%= link_to "English", static_english_path%>
                        
<%= link_to "Español", static_spanish_path%>
                    
 
                

            

        

    

That was only for the navbar, now you need to do the rest, add the markup your template shows you to do, with all your app, its not an easy job, but thats how its done.